Review count not work on search page - bigcommerce

I placed this Code on card.html, review count is not work only search page.
{{#if show_rating}}
<p class="card-text" data-test-info-type="productRating">
<span class="rating--small">
{{> components/products/ratings rating=rating}}
</span>
<span class="productView-reviewLink">
{{#if rating '>' 0}}
<a href="{{url}}#product-reviews">
{{lang 'products.reviews.link_to_review' total=num_reviews}}
</a>
{{else}}
{{lang 'products.reviews.link_to_review' total=num_reviews}}
{{/if}}
</span>
</p>
{{/if}}

Related

Bigcommerce How can I set login and register links on header with fortune theme

I'm using Fortune and the 'Login and Register' are at the bottom of the page. Does anyone know how to put it at the top of the page with the other headings.
Please use below code:
{{#if customer}}
<li class="header-navigation-item navigation-item-primary">
<a class="navigation-link-primary" href="{{urls.account.index}}">{{lang 'account_general.your_account'}}</a>
</li>
<li class="header-navigation-item navigation-item-primary">
<a class="navigation-link-primary" href="{{urls.auth.logout}}">{{lang 'account_general.log_out'}}</a>
</li>
{{else}}
<li class="header-navigation-item navigation-item-primary">
<a class="navigation-link-primary" href="{{urls.auth.login}}">{{lang 'account_general.log_in'}}</a>
</li>
{{#if settings.account_creation_enabled}}
<li class="header-navigation-item navigation-item-primary">
<a class="navigation-link-primary" href="{{urls.auth.create_account}}">{{lang 'account_general.sign_up'}}</a>
</li>
{{/if}}
{{/if}}

show brands on home.html stencil theme bigcommerce

I am using BigCommerce Theme for my website and I was trying to show Brands on homepage. I used below mentioned code but it does not give any output. Here is my code
<ul class="brandGrid">
{{#each brands}}
<li class="brand">
<article class="card {{#if alternate}}card--alternate{{/if}}">
<figure class="card-figure">
<a href="{{url}}">
<img class="card-image" src="{{getImage image 'brand_size' (cdn ../theme_settings.default_image_brand)}}" alt="{{name}}" title="{{name}}">
</a>
</figure>
<div class="card-body">
<h4 class="card-title">
{{name}}
</h4>
</div>
</article>
</li>
{{/each}}
</ul>

Adding side bar "Shop by Brands" in Bigcommerce stencil theme

I'm trying to add a shop by brand to a Bigcommerce theme. I've been through the template files and can't seem to make out what I need to do. I found the "shop-by-price.html" template page and I figured I could just paste some code above it but can't seem to find the brand listing code.
Here's the shop-by-price.html page
{{#if shop_by_price}}
<div class="sidebar-block shop-by-price facet-list" data-facet-filter>
{{> components/common/facet-toggle title=(lang 'category.shop_by_price')}}
<ul class="facet-list-items is-open" data-facet-filter-wrapper>
{{#each shop_by_price}}
<li class="facet-item">
<a class="{{#if selected }}is-active{{/if}}" href="{{url}}" alt="{{low.formatted}} - {{high.formatted}}">{{low.formatted}} - {{high.formatted}}</a>
</li>
{{/each}}
</ul>
{{#any shop_by_price selected=true}}
<a href="{{category_url}}" class="link facet-remove">
{{lang 'category.reset'}}
</a>
{{/any}}
</div>
{{/if}}
if I am not wrong so you want to show brands list in category sidebar page so please open your stencil theme editor from admin end then
templates->components->category->sidebar.html open the file sidebar.html and paste below code
<nav>
{{#if category.subcategories}}
<div class="sidebarBlock">
<h5 class="sidebarBlock-heading">{{category.name}}</h5>
<ul class="navList">
{{#each category.subcategories}}
<li class="navList-item">
<a class="navList-action" href="{{url}}" alt="{{name}}" title="{{name}}">{{name}}</a>
</li>
{{/each}}
</ul>
</div>
{{/if}}
{{#if shop_by_brand}}
<div class="sidebarBlock">
<h5 class="sidebarBlock-heading">{{lang 'brand.label'}}</h5>
<ul class="navList">
{{#each shop_by_brand}}
<li class="navList-item">
<a class="navList-action" href="{{url}}">{{name}}</a>
</li>
{{/each}}
<li class="navList-item">
<a class="navList-action" href="{{urls.brands}}">{{lang 'common.view_all'}}</a>
</li>
</ul>
</div>
{{/if}}
{{#if category.faceted_search_enabled}}
{{> components/faceted-search/index category}}
{{else}}
{{> components/category/shop-by-price shop_by_price=category.shop_by_price category_url=category.url}}
{{/if}}
</nav>
after hit the save and apply button it will look like this
http://deepak-diwan-s-store.mybigcommerce.com/ala-carte-by-the-lb/

Selenium IDE `select` command fails to locate element - whose ID was filled automatically by the IDE

My problem: I'm failing to select an element in Selenium IDE, even though the target ID is filled automatically by the IDE.
Problem description:
In http://instantsearchplus.myshopify.com/, I want to type in the search field (top right).
This is the HTML code for the search field:
<input name="q" value="" aria-label="Search our store"
class="header-bar__search-input ui-autocomplete-input"
autocomplete="OfF" autocorrect="off" autocapitalize="off"
id="input_id_0_suggestor_007" isp_ac="OfF" type="search">
So, I enter the select Command, and after clicking on the search field, Selenium IDE automatically fills the Target with id=input_id_0_suggestor_007.
All is well, right?
Wrong!
When I try to run the script, I get the error
[info] Playing test case Untitled 2
[info] Executing: |open | / | |
[info] Executing: |select | id=input_id_0_suggestor_007 | |
[error] Element id=input_id_0_suggestor_007 not found
[info] Test case failed
What am I doing wrong?
Note: I tried various select related commands (select, selectFrame, selectWindow, etc. ) with a variety of possible targets (id, name, css, etc. ) - but did not find any combination that works. Click also didn't work.
The HTML code around the search field:
<div class="header-bar">
<div class="wrapper medium-down--hide">
<div class="large--display-table">
<div class="header-bar__left large--display-table-cell">
</div>
<div class="header-bar__right large--display-table-cell">
<div class="header-bar__module">
<a href="/cart" class="cart-toggle">
<span class="icon icon-cart header-bar__cart-icon" aria-hidden="true"></span>
Cart
<span class="cart-count header-bar__cart-count">2</span>
</a>
</div>
<div class="header-bar__module header-bar__search">
<form action="/pages/search-results" method="get" role="search">
<span role="status" aria-live="polite" class="isp_polite_powered_by_id ui-helper-hidden-accessible">Powered by InstantSearch+ Site Search Autocomplete</span><input name="q" value="" aria-label="Search our store" class="header-bar__search-input ui-autocomplete-input" autocomplete="OfF" autocorrect="off" autocapitalize="off" id="input_id_0_suggestor_007" isp_ac="OfF" type="search">
<button type="submit" class="btn icon-fallback-text header-bar__search-submit">
<span class="icon icon-search" aria-hidden="true"></span>
<span class="fallback-text">Search</span>
</button>
</form>
</div>
</div>
</div>
</div>
<div class="wrapper large--hide">
<button type="button" class="mobile-nav-trigger" id="MobileNavTrigger">
<span class="icon icon-hamburger" aria-hidden="true"></span>
Menu
</button>
<a href="/cart" class="cart-toggle mobile-cart-toggle">
<span class="icon icon-cart header-bar__cart-icon" aria-hidden="true"></span>
Cart <span class="cart-count">2</span>
</a>
</div>
<ul id="MobileNav" class="mobile-nav large--hide">
<li class="mobile-nav__link" aria-haspopup="true">
<a href="/" class="mobile-nav">
Home
</a>
</li>
<li class="mobile-nav__link" aria-haspopup="true">
<a href="/search" class="mobile-nav">
Search page
</a>
</li>
<li class="mobile-nav__link" aria-haspopup="true">
<a href="http://instantsearchplus.myshopify.com/pages/search-results/collections-accessories" class="mobile-nav">
Accessories
</a>
</li>
<li class="mobile-nav__link" aria-haspopup="true">
<a href="http://instantsearchplus.myshopify.com/pages/search-results/collections-best-seller" class="mobile-nav">
Best Seller
</a>
</li>
<li class="mobile-nav__link" aria-haspopup="true">
<a href="http://instantsearchplus.myshopify.com/pages/search-results/collections-gloves" class="mobile-nav">
Gloves
</a>
</li>
<li class="mobile-nav__link" aria-haspopup="true">
<a href="/pages/about-us" class="mobile-nav">
About us
</a>
</li>
</ul>
</div>
ClickAt //input works
Indeed, select command is usually meant for selecting options from a select tag.
Here's a quote from the documentation
Constructor. A check is made that the given element is, indeed, a SELECT tag. If it is not, then an UnexpectedTagNameException is thrown.

Correct Breadcrumbs Structure with child

Which one is correct breadcrumb structure?
Example 1:
<a href="http://example.com/topic" itemprop="url">
<span itemprop="title">Topic Archive</span></a>
<div itemprop="child" itemscope itemtype="http://data-vocabulary.org/Breadcrumb" style="display: inline;">
<a href="http://example.com/topic/parent-category" itemprop="url">
<span itemprop="title">ParentCategory</span></a>
</div>
<div itemprop="child" itemscope itemtype="http://data-vocabulary.org/Breadcrumb" style="display: inline;">
<a href="http://example.com/child-category" itemprop="url">
<span itemprop="title">Child Category</span></a>
</div>
<span>Post Title Goes Here</span>
</div>
Example 2:
<div id="breadcrumb">
<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a rel="home" href="http://www.example.com/topic" itemprop="url"><span itemprop="title">Topic Archive</span></a> ›
<span itemprop="child" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<span itemprop="title">Parent Category</span> ›
<span itemprop="child" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<span itemprop="title">Child Category</span> ›
</span>
<span>Post Title Goes Here</span>
</span>
</span>
</div>
Example 3:
<div id="breadcrumb">
<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a rel="home" href="http://www.example.com/topic" itemprop="url"><span itemprop="title">Topic Archive</span></a> ›
<span itemprop="child" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<span itemprop="title">Parent Category</span> ›
<span itemprop="child" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<span itemprop="title">Child Category</span> ›
<h1 itemprop="child" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<span itemprop="title">Current Post Title</span> ›
</h1>
</span>
</span>
</span>
</div>
Test the code here: Google Testing Tool
For example number 3, is it right to include the current page in breadcrumb schema? Do I violate any rules?
If you want to use data-vocabulary.org (which is already considered outdated), example 3 is the most correct. It is standard to include the current page in the breadcrumb. Example 1 is not correct since you have not nested your elements. In this case, you would want to add the itemref property and give ids to your divs. The itemref property should equal the id of the next child. https://developers.google.com/structured-data/breadcrumbs?rd=1
You should definitely consider moving to schema.org, since that is the format the major search engines will almost certainly agree upon. According to schema.org, none of these are the proper implementation. Your overall list should be marked as a BreadcrumbList, with each item being marked as a ListItem. Yes, by convention, the current page is the last item in the list.
https://schema.org/BreadcrumbList