Expand the panels to view the topic details, guides & instructions. This tutorial comes with videos to help guide users for further understanding & speed up installation process.
Use only what you need!
Add parameters in any order but only to the assigned Config Widget.
Click
Add parameters in any order but only to the assigned Config Widget.
Click
View Dashboard to view the Config Widget locations.
6.1 How to Create a Blog Page?
To create a blog page is easy with BlogrCart themes as pages styles used is handled by theme itself. Now you can add multiple Labels for a Blog page, but the
Blog Label is required to be included to help differentiate display of articles from your product pages.To create a Blog page, upon clicking the
Pencil button, automatically the product post helper displays at your Blog editor. You can remove all the contents by selecting the existing contents & deleting it to start your new post.Add images or insert text accordingly. Most of the text styles & headers is handled by the theme. If copy & paste texts is used, make sure to clear the copied format by
selecting the copied texts & click the Remove formatting button. This will allow consistency of fonts used & how it displayed for your blog posts.If the meta tags is activated, add in the
meta description for your post. Include Label to help categorize in Blog search pages.Note: By default, in normal store search, only product page will display. Blog search pages will only display if it is labeled
Blog under the search/label/Blog Blogger features.
How to include default image (if none is found)?
Add fallback image if product or blog page image is not found.
Add fallback image if product or blog page image is not found.
6.2 How to include default image (if none is found)?
The meta tags which comes with BlogrCart themes are very powerful, especially in helping to expose your product & pages in search engine results. These tags are used by social media services to retrieve the necessary information.
By default we have included
fallback image, if however an image could not be found from your page when sharing to social networks etc. You can customize or add in your own image to use as fallback image if an image could not be retrieved.Go to
Template Editor > backup if necessary > Now find below codes (highlighted yellow) & replace it to your uploaded image. Use Ctrl+F & type the keyword at the search bar (inside code editor) > press enter. It will lead you to the specific codekeyword:
rel='image_src'<meta content='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiY3DnqkoVaVNlR49rJW6cbugNMuXaQ3qsmZd7Fe57rWCmErQa7YdeEyT6O6t7K1czbkIsjBYF9y0oDsq08EcXgSmCNNQGGupkuc4Ti4hx5oWZzxUujvL5cTw-WV1Z6SLzIU7yDU9VFqXk/s1600/placeholder-image.jpg' property='og:image' rel='image_src'/>
keyword:
placeholder-image.jpg<b:else/><img class='item_thumb' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiY3DnqkoVaVNlR49rJW6cbugNMuXaQ3qsmZd7Fe57rWCmErQa7YdeEyT6O6t7K1czbkIsjBYF9y0oDsq08EcXgSmCNNQGGupkuc4Ti4hx5oWZzxUujvL5cTw-WV1Z6SLzIU7yDU9VFqXk/s1600/placeholder-image.jpg'/></b:if>
keyword:
placeholder-image.jpg<img class='img-responsive' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiY3DnqkoVaVNlR49rJW6cbugNMuXaQ3qsmZd7Fe57rWCmErQa7YdeEyT6O6t7K1czbkIsjBYF9y0oDsq08EcXgSmCNNQGGupkuc4Ti4hx5oWZzxUujvL5cTw-WV1Z6SLzIU7yDU9VFqXk/s1600/placeholder-image.jpg'/>
How to include mobile Apps icons for Android & IOS devices?
Add a custom mobile Apps icon for popular mobile devices.
Add a custom mobile Apps icon for popular mobile devices.
6.3 How to include Mobile apps web icons?
BlogrCart themes also comes with mobile apps icons which will display on mobile devices if a user bookmark your Blogger store. The icons will display at user's smart phone Home Screen if saved or bookmarked weather on IOS or Android powered phones.
In download files, we have included sample icons which you can use to find out the sizes required. To include your own Apps icons, here are the sizes required:-
For Android phones (sizes in pixels):-
sizes='128x128'- for older Android phonessizes='192x192'- for newer Android phones
For IOS ( sizes in pixels):-
sizes='76x76'sizes='120x120'sizes='152x152'sizes='215x215'- for Retina display
To replace to your own icon, go to
Template Editor > backup if necessary > <!-- IOS and ANDROID APPS ICON IMAGES --> replace the href link to your uploaded icon. Make sure the correct size is included as indicated at the mark-up codes.Below is an example to replace an IOS icon (highlighted yellow) with
76x76 pixels in image size:-<!-- IOS and ANDROID APPS ICON IMAGES -->
<link href='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEih8hB7Cd0UJMUnCuwMSMXewbdmSHQbjbSWaYWk4GLAwBph4f5UfKdISRbdYkdYM6au7G4osgiH9hWlaOb8f-7O8rxmY3M9oZSLije54RF1Gj8-95iQZuYEDcYuAUDSMhjobtZWkKu6q77w/s1600/apple-touch-icon-76x76.png' rel='apple-touch-icon' sizes='76x76'/>
6.4 How to disable sticky navigation?
To disable the navigation sticky/floating effect, Go to your
Blogger Dashboard > Layout > find Theme Config widget. Click edit to insert the parameter required to deactivate the functionality.At
Site Name input field include the following parameter navbar_sticky_destroy . At the Site Url field add the true . Click Save to save your settings & click Save Arrangements. Preview your changes.To re-activate,
delete the above parameter.
How to change fonts & background colors?
Use Template Designer to pick & select your preferred fonts, color & background colors.
Use Template Designer to pick & select your preferred fonts, color & background colors.
6.5 How to change fonts & background colors?
Customize this BlogrCart theme is made easy by using
Blogger Template Designer. Go to Template > click the Customize button > at Template Designer UI > click the Advance link.There is more than 20 custom changes for this BlogrCart theme which you can choose to customize accordingly. Live changes can be viewed at Blogger Template Designer itself.
To revert back to theme default state, for each changes done, click the
Clear advanced changes to body background color
.Click the
Apply to Blog to save your edits. Preview the changes.
How activate Blogger Adsense Ads Placement?
Activate Adsense ads placement in posts & using Blogger native ads activation.
Activate Adsense ads placement in posts & using Blogger native ads activation.
6.6 How to activate Adsense for Blogger?
This BlogrCart theme comes with Adsense ads placement for blog posts which can be activated from your Blogger dashboard Blog widget.
Due to un-popular response from users for native Blogger ads placement (of course as a shop you'll probably like to put up your own ads right?) as part of our theme integration, we have included the functionality with BlogrCart themes.
If users require (or want) to use Blogger native Adsense placements in posts, you can activate by
omitting / deleting a few lines (which is marked) in your template.Go to
Template > Edit HTML > Backup if necessary > click Jump to widget > select Blog1. At Blog1 widget codes > expand <b:includable id="main"> to view codes as below:-<!-- // remove this line to use Adsense <data:defaultAdStart/> remove this line to use Adsense -->
Remove/delete each line as indicated as highlighted above. There should be 8 lines to be deleted.After doing so, click
Save Template and view the changes.
This BlogrCart Theme also comes with troubleshooting helpers. If you feel that the configurations set is not functioning as expected, press F12 on your computer keyboard and view your browser Console Logs.
Have a question or having some trouble?
Send it to us using this theme support page here. Our team members would gladly assist you.[*] Unless otherwise stated in theme/template listings.
