(V5) How do I add my store's social media links and icons? Print

  • social media
  • 0

You can go to Store Settings > General Settings > Store in your administration panel, and set up the URLs of the social media accounts that you want to use.



You can then create links to them in the footer menu, in an HTML block, an information page, your product & category, and blog post by using the Shortcodes feature of Ozcart.

Shortcodes are a pre-written tag that is put into a piece of content and Ozcart does a find-and-replace of that tag with the content that it represents when the page is displayed to your visitors. The shortcodes insert the correct link that you add in the admin area, with the name of the social media account that they represent (at the time of writing, the shortcodes below do not produce icons on their own but only with the help of another shortcode, see below).

You can leave blank any social media accounts that you do not use.

 

Shortcodes that you can use

[store_facebook]
Inserts a HTML text link to your store's Facebook page that you have set up in Store Settings > General Settings > Store - you can use it in landing pages, blog posts or even product descriptions.

[store_twitter]
Inserts a HTML text link to your store's Twitter feed that you have set up in Store Settings > General Settings > Store - you can use it in landing pages, blog posts or even product descriptions.

[store_pinterest]
Inserts a HTML text link to your store's Pinterest board that you have set up in Store Settings > General Settings > Store - you can use it in landing pages, blog posts or even product descriptions.

[store_instagram]
Inserts a HTML text link to your store's Instagram that you have set up in Store Settings > General Settings > Store - you can use it in landing pages, blog posts or even product descriptions.

[store_googleplus]
Inserts a HTML text link to your store's Google+ page that you have set up in Store Settings > General Settings > Store - you can use it in landing pages, blog posts or even product descriptions.

 

Display only icons

Here's the shortcode to display only the social media icons, without the text:

[store_social icons="social-media-name-here" justtext="N"]

Where social-media-name-here is, type the name of the social media network, e.g., instagram.
You can also type multiple names there and separate each one with a comma, without space.
Where the capital N is, that means No. This value works with justtext="", which means "just display the text", and the N means No. If you change it to a capital Y, then it would mean Yes, display only the text, e.g., Instagram.

Examples:

  • List of multiple social media networks: [store_social icons="facebook,twitter,pinterest,instagram" justtext="N"]
  • One social media network: [store_social icons="instagram" justtext="N"]

 

Display icons next to the social media text links

You need to add the following icon shortcode before the text only shortcode (or after, if you want the icon displayed to the right of the social media network name):

[store_social icons="social-media-name-here" justtext="N"]

Where social-media-name-here is, type the name of the social media network, e.g., pinterest.
Where the capital N is, that means No. This value works with justtext="", which means "just display the text", and the N means No. If you change it to a capital Y, then it would mean Yes, display only the text, e.g., Pinterest.

Example: [store_social icons="pinterest" justtext="N"][store_pinterest]

 

Manually add icons

If some shortcodes do not work in a specific location on your website or if you want to add other types of icons, you can manually add any type of icon using:

  1. Font Awesome - Ozcart supports Font Awesome natively and all you need to do is add a code to a text editor's Source (Code View) with, or without, the name of the icon to the right (or left, if you prefer) of the icon, like this: <i class="fa fa-shopping-cart"></i> Shopping Cart
  2. Download and upload icons from websites like IconsDB.

 

Learn more about shortcodes and see the full list

Learn about how to set up your store's information


Was this answer helpful?

« Back

["\r\n