This page contains all the shortcodes this theme features. You can usem everywhere in the theme.. 🙂 Feel free to use them and if something goes wrong or you do not understand it shoot us an email at support@ketchupthemes.com . Below you can find all the shortcodes, their code and examples. A Word of warning: When using shortcodes you should not leave a space between the ‘[‘ and the shortcode code.
Content & Layouts
1. Row shortcode — It creates a new row.Should use it always first.
[ new_row class="special_class" id="special_id" ] ...Content goes here ,you should use columns ... [ /new_row ]
2.Full width column — It should be used inside a row. It creates a full width element insiden this row.
[ one_full_column class="special_class" id="special_id" ] ...Content goes here [ /one_full_column]
3. Half columns — You can add columns till you reach 1/1. For example you can have up to 2 half columns within a row.
[ half_column class="special_class" id="special_id" ] ...Content goes here ... [ /half_column]
4. 1/3 Columns
[ a_third_column class="special_class" id="special_id" ] ...Content goes here ... [ /a_third_column]
5. 1/4 Columns
[ a_fourth_column class="special_class" id="special_id" ] ...Content goes here ... [ /a_fourth_column]
6. 1/6 Columns
[ a_sixth_column class="special_class" id="special_id" ] ...Content goes here ... [ /a_sixth_column]
7. 2/3 Column – This is a special column of 66.7% percent width. You can use it with the “a_third_column” in the same row.
[ a_two_third_column class="special_class" id="special_id" ] ...Content goes here ... [ /a_two_third_column]
8. 3/4 Column – This is a special column of 75% percent width. You can use it with the “a_fourth_column” in the same row.
[ a_three_fourth_column class="special_class" id="special_id" ] ...Content goes here ... [ /a_three_fourth_column]
9. 5/6 Column – This is a special column of 80% percent width. You can use it with the “a_sixth_column” in the same row.
[ a_five_sixth_column class="special_class" id="special_id" ] ...Content goes here ... [ /a_five_sixth_column]
Buttons
This theme utilizes the Bootstrap 3 buttons with the help of the fontawesome icons. Buttons are actually links styled as buttons. You can set the target url if any.
10. Simple Buttons – Links
[ button class="special_class" id="special_id" type="btn-primary" size="btn-md" button_text="Link Text" url="http://example.com" url_target="_blank" fontawesome_class="fa-flag fa-2x"]
11. Spacer – A spacer adds space (margin top and margin bottom). By default it sets 10px top and 10px bottom margins..You can also add some padding top and padding bottom.
[ spacer class="special_class" id="special_id" margin_top="10px" margin_bottom="10px" padding_bottom="0px" padding_top= "0px"]
12. Title. Use this shortcode to create section titles . You can use it everywhere.There also an option of adding a subtitle as well.
[ title css_class="special_class" id="special_id" title="Title goes here" subtitle="Subtitle goes here" type="blank or inverted"]
Title goes here
This is the subtitle and it goes down here.Feeling free..
Only title without subtitle
I am an inverted title
13. Banner. Use this shortcode to create a section banner. You add an image url +the banner’s URL if there is any. Every image you upload it is made responsive.
[ banner class="special_class" id="special_id" banner_img_url="url here" banner_url=""]
14. Background color. You can wrap your contents, columns, rows into a background colored section..
[ background_color css_class="special_class" id="special_id" background_color="#colorhex" ]...content...[ /background_color]
15. Background Image. You can wrap your contents, columns, rows into an image background.
[ background_image css_class="special_class" id="special_id" background_img_url="background_img_url" image_height="write image height" ]...content...[ /background_image]
Ps: You can now also use the [ background_pattern ] shortcode.
Title goes here
Content Blocks, Sliders & Carousels
Maybe the most interesting part of the shortcodes are presented here.
16. Custom content block .
[ custom_content_block css_class="special_class" id="special_id" title="Block Title" subtitle="Block Subtitle" image_url="block_featured_image_url" content="text text and...text" read_more_link="http://example.com" read_more_text="Button Text"]

Nice title here..
Block Subtitle
Mauris molestie pellentesque neque, vel sagittis felis placerat porta! Pellentesque..Mauris molestie pellentesque neque, vel sagittis felis placerat porta!

Block Title
Block Subtitle
Mauris molestie pellentesque neque, vel sagittis felis placerat porta! Pellentesque.. Mauris molestie pellentesque neque, vel sagittis felis placerat porta!

Block Title
Block Subtitle
Mauris molestie pellentesque neque, vel sagittis felis placerat porta! Pellentesque..Mauris molestie pellentesque neque, vel sagittis felis placerat porta!

Block Title
Block Subtitle
Mauris molestie pellentesque neque, vel sagittis felis placerat porta! Pellentesque..Mauris molestie pellentesque neque, vel sagittis felis placerat porta vel sagittis felis placerat porta!

Block Title
Block Subtitle
Mauris molestie pellentesque neque, vel sagittis felis placerat porta! Pellentesque.. Mauris molestie pellentesque neque, vel sagittis felis placerat porta! vel sagittis felis placerat porta
17. Category block. You can use this shortcode to create post block from certain categories.
[ category_block class="special_class" id="special_id" category_slug="The post category slug" posts_number="4"]
No posts found for this category..
No posts found for this category..
No posts found for this category..
No posts found for this category..
No posts found for this category..
No posts found for this category..
17. Tag block. You can use this shortcode to create post block from certain tags.
[ tag_block class="special_class" id="special_id" tag_slug="The tag slug" posts_number="3"]
Tag Blocks as well...
No posts found for this category..
No posts found for this category..
18. Posts Slider. You can add a very slick posts carousel (latests posts) whenever you need it. Just add the shortcode below.
[ posts_slider css_class="special_class" id="special_id" post_number="5" orderby="title" category_slug="leave blank for all" post_excerpt_length="20" ]
19.Posts Carousel. You can add a nice and slick carousel.
[ posts_carousel css_class="special_class" id="special_id" post_number="5" orderby="date" category_slug="leave blank for all" post_excerpt_lenght="10" carousel_posts_number="the number of the carousel items"]