WHAT IS THE DIFFERENCE BETWEEN THE FREE AND THE PRO SHOPIFY THEME VERSION?
What is a shortcodes?
Shortcodes is a way of allowing non- coding users of Shopify to output some type of feature into their pages and posts. The powerful Shortcodes comes with a lot of features that lets you do nifty things with very little effort . Shortcodes can embed or create objects such as facebook, youtube , font awesome, alert or much more that would normally require lots of complicated, ugly code in just simple one line. Especially , this will save you hours of development and increase your sales by providing you with the tools to create the calls-to-action you need.
Available shortcodes
1. Facebook
[facebook idPage="apollotheme"]
2. Youtube
[youtube width="600" height="350" video="aE7-KZVXvJs"]
3. Font awesome
[icon iconClass="envelope"] [icon iconClass="bar-chart"] [icon iconClass="motorcycle"] [icon iconClass="automobile"] [icon iconClass="heart"]
4. Alert
[alert type="success" message="This is alert type Success"]
[alert type="info" message="This is alert type Info"]
[alert type="warning" message="This is alert type Warning"]
[alert type="danger" message="This is alert type Danger"]
5. Button
Button type
-
[button type="default" text="Default" url="http://www.shopify.com/"]
[button type="primary" text="Primary"] [button type="success" text="Success"]
[button type="Info" text="Info"] [button type="Danger" text="Danger"]
[button type="Link" text="Link" url="http://www.shopify.com/" isOpen="isOpen"]
Button Size
[button type="default" text="Default size large" size="lg"]
[button type="primary" text="Primary size default"]
[button type="success" text="Success size small" size="sm"]
[button type="Info" text="Info size extra small" size="xs"]
Button Block[button type="Danger" text="Danger size block" isBlock="block"]
Button Link
[button type="default" text="Default and link" url="http://www.shopify.com/"]
[button type="primary" text="Primary and link open new tab" url="http://www.shopify.com/" isOpen="isOpen"]
6. Accordion
[accordion action="new accordions" class="demoaccordion"]
[accordion action="new accordion" title="accordion title sample 1" active="1"]
You can add html
[accordion action="end accordion"]
[accordion action="new accordion" title="accordion title sample 2"]
You can add other shortcode
[accordion action="end accordion"]
[accordion action="new accordion" title="accordion title sample 3"]
You can add image
[accordion action="end accordion"]
[accordion action="end accordions"]
7. Tab
[tab action="new tabs" ]
[tab action="new cover-tab-list"]
[tab action="new tab-list" title="Tab 1" active="active"]
[tab action="new tab-list" title="Tab 2"]
[tab action="new tab-list" title="Tab 3"]
[tab action="new tab-list" title="Tab 4"]
[tab action="end cover-tab-list"]
[tab action="new tab-content"]
[tab action="new tab-panel" active="active"]
Content tab 1
[tab action="end tab-panel"]
[tab action="new tab-panel"]
Content tab 2
[tab action="end tab-panel"]
[tab action="new tab-panel"]
Content tab 3
[tab action="end tab-panel"]
[tab action="new tab-panel"]
Content tab 4
[tab action="end tab-panel"]
[tab action="end tab-content"]
[tab action="end tabs"]
8. Lightbox
[lightbox url="http://cdn.shopify.com/s/files/1/0740/5717/products/11_large.jpeg?v=1425525113" text="Content is image" class="btn btn-info"
Image :
[lightbox url="#id-content-html" text="Content is html"] <div id="id-content-html" style="display: none;" >This is content html, you can append other text, shortcodes:<br/><br/> [button isOpen="open" type="primary" text="Start here" url="http://www.shopify.com/" class="btn btn-info"]</div>
HTML:
[lightbox url="https://www.youtube.com/embed/oWVqE9TOopE?autoplay=1" text="Type iFrame" type="iframe" class="btn btn-info"]
Iframe:
[lightbox url="http://cdn.shopify.com/s/files/1/0740/5717/products/11_large.jpeg?v=1425525113" text="Effect is fade" effect="fade" class="btn btn-info"] [lightbox url="http://cdn.shopify.com/s/files/1/0740/5717/products/11_large.jpeg?v=1425525113" text="Effect is elastic" effect="elastic" class="btn btn-info"] [lightbox url="http://cdn.shopify.com/s/files/1/0740/5717/products/11_large.jpeg?v=1425525113" text="Effect is none" effect="none" class="btn btn-info"]
[lightbox url="http://cdn.shopify.com/s/files/1/0740/5717/products/11_large.jpeg?v=1425525113" text="Image 1" effect="fade" type="gallery" skipJs="true" rel="gallery-1"] [lightbox url="http://cdn.shopify.com/s/files/1/0740/5717/products/42_d3f99124-d8ca-4dd5-b6d2-d74b3feb31b1_large.jpeg?v=1425525113" text="Image 2" effect="fade" type="gallery" skipJs="true" rel="gallery-1"] [lightbox url="http://cdn.shopify.com/s/files/1/0740/5717/products/21_1b737bd3-c656-43be-8e96-6a8aeaaaf19b_large.jpeg?v=1425525113" text="Image 3" effect="fade" type="gallery" rel="gallery-1"] Lightbox
[tooltip placement="left" type="button" text="Tooltip on left" title="Tooltip on left" class="my-tooltip" id="id-tooltip-1" url="http://shopify.com" isOpen="open"] [tooltip placement="right" type="span" text="Tooltip on right" title="Tooltip on right and link" class="my-tooltip" id="id-tooltip-2" url="http://shopify.com"] [tooltip placement="top" type="button" text="Tooltip on top" title="Tooltip on top and not link" class="my-tooltip" id="id-tooltip-3"] [tooltip placement="bottom" type="span" text="Tooltip on bottom" title="Tooltip on bottom and not link" class="my-tooltip" id="id-tooltip-4"]
9.Box
[box action="new box" class="box-default" width="1"] [box action="new header"] The header box [box action="end header"] [box action="new content"] You can append html or other shortcodes [button type="primary" text="Learn more →" url="http://www.shopify.com/"] [box action="end content"] [box action="end box"]
10. Line
[line class="hr-default" size="1"][line class="hr-green" size="10"]
11. Slide
[carousel action="new slider" class="my-carousel-1"] [carousel action="display indicators" total="3" active="1"] [carousel action="new list slide"] [carousel action="new slide" active="active" ] <img src="https://placehold.it/1600x400/333333/FFFFFF&text=Slide+1" alt="altttttttt"> <div class="carousel-caption">Caption 1</div> [carousel action="end slide"] [carousel action="new slide"] <img src="https://placehold.it/1600x400/333333/FFFFFF&text=Slide+2" alt="altttttttt"> <div class="carousel-caption">Caption 2</div> [carousel action="end slide"] [carousel action="new slide"] <img src="https://placehold.it/1600x400/333333/FFFFFF&text=Slide+3" alt="altttttttt"> <div class="carousel-caption">Caption 3</div> [carousel action="end slide"] [carousel action="end list slide"] [carousel action="display control"] [carousel action="end slider"]
12. Product list
[productlist handle="women" columnsProduct="3" limit="6" class="my-product-list" id="id-product-list"]
13. Owlcarousel
[owlcarousel action="new owlcarousels" class="demo-carousel" columns_item="1"] [owlcarousel action="new owlcarousel"] <img alt="Autumn Collection 2015" src="//cdn.shopify.com/s/files/1/0766/6813/t/2/assets/slideshow_image_1.jpg"> [owlcarousel action="end owlcarousel"] [owlcarousel action="new owlcarousel"] <img alt="Autumn Collection 2015" src="//cdn.shopify.com/s/files/1/0766/6813/t/2/assets/slideshow_image_2.jpg"> [owlcarousel action="end owlcarousel"] [owlcarousel action="new owlcarousel"] <img alt="Autumn Collection 2015" src="//cdn.shopify.com/s/files/1/0766/6813/t/2/assets/slideshow_image_3.jpg"> [owlcarousel action="end owlcarousel"] [owlcarousel action="end owlcarousels"]
14. Carousel product list
[productcarousel title="Product list" handle="women" item_in_page="4" columns_product="4" product_in_tab="8" interval="10000"]
15. Owlcarousel product list
[productowlcarousel title="Product list" handle="women" columns_product="4" product_in_list="16" interval="10000"]
16. Shortcodes immediately in HTML & CSS
Moreover, you are also add shortcode to everywhere of your site by editing in HTML & CSS .
{% include 'shortcode' load: '[facebook idPage="apollotheme"]' %}
P/s : Thanks for reading! We hope you’re as excited as we are about this our shortcode. We continue to build things to make new framework better, and we hope you like it.
Related Posts
About the author
Apollo Theme is the most modern provider of Shopify Template. With 9 years experience, we bring many modern and perfect themes to everyone. With the aim of providing high-quality products for customers, our talented team always tries to work hard and catch up the new trend of technology and design to give you more valued template with a unique combination of new ideas, flexible architecture and easy-to-use product. We are really appreciated it and hope that you enjoy it! Apollo Template want bring the highest customer satisfaction, we have professional supporting team to assist all our buyer. All support will be conducted through our support ticket "https://apollotheme.com/ticket/", send your problems to our email: "apollotheme@gmail.com" or at our facebook with name “Apollo Theme”. We usually get back to you within 24hours. (except holiday seasons which might take longer).
Related posts
593872 555714Thank you for the auspicious writeup. It in truth used to be a amusement account it. Glance complex to much more added agreeable from you! Nevertheless, how could we be in contact? 877202
you’re in reality a just right webmaster. The web site loading velocity is incredible. It kind of feels that you are doing any distinctive trick. Furthermore, The contents are masterpiece. you have performed a excellent job in this matter!
Just desire to say your article is as astounding. The clearness in your post is just cool and i could assume you’re an expert on this subject. Well with your permission allow me to grab your RSS feed to keep updated with forthcoming post. Thanks a million and please keep up the enjoyable work.