Getting the Most from Woo Framework Shortcodes
The final step of the guide to the Woo Frameworkfor the Bueno WordPress Theme will take you through every aspect of the Framework, from shortcodes for your posts to updating the framework.
Step 1) Login to the WordPress Dashboard.
Step 2) To find the Bueno framework, head to your Dashboard and scroll down the left-hand sidebar until you find Bueno. Click on this and you will be taken to the Settings page, where a top navigational bar will let you choose between Settings and Framework. On the Framework page, you can update it whenever a newer version is released, or create a back-up for your settings.
The next steps of this guide will focus on the in-page framework of the Theme.
Step 3) To create a new post (you can also do the same for pages), head to the Dashboard and click on Posts. You can also hover your cursor over New at the top of the page and then choose Post, which will cut out the next step.
Step 4) From the Posts page, click on Add New to get started with a new post.
Step 5) The Woo Frameworkoperates in a similar way to the ordinary WordPress themes, only a Woo Theme has special Shortcodes built in, which we will take you through in the next few steps.
At the bottom of the post, you will see the Bueno Settings. This is where you can add the URL of the image that you are going to use for the post, which in turn will be resized by the Dynamic Image Resizer to created the thumbnail to your post.
Step 6) The first Shortcode is creating a button for your website. By using the customisation tools available, you can give the button a title (e.g. Click Here or Buy Now), add a link (which will take the user who clicks on the button to a desired page/post), size, colour, border and other tools to change how the button looks and functions on the page. This is useful when you want to create a call to action on your posts.
Step 7) The Icon Link Shortcode operates in a similar way to the button, but instead of a button, an icon is in place, and all the aforementioned customisations are built to make your users click on it. Your icon could be a picture of your product or something that your user will notice and click on if what you are linking to is a service.
Step 8) An Info Box can save you a great deal of time on writing out specific information, including product descriptions. By adding the content and customising the size and structure of the box, a simple click can add all the info you need in a split second.
Step 9) Woo Themes have made it easy for users to change typography and add highlights, abbreviations and more to their posts with a simple click of a button. When you click on an option, simply add the text between the two bars and when your post is live, your typography will show.
Step 10) For the Content Toggle Shortcode, you can create a toggle that holds hidden information that you can open and close at will. The option below shows Open Me and Close Me, but you can alter these as you wish and add the content that you wish to toggle in the box provided.
Step 11) The Related Content Shortcode is used to show related posts at the bottom of the posts you can create. You can set a limit (5 is the default), and set a thumbnail image for the section if you wish. This is a great way to keep visitors on your site.
Step 12) The Contact Form Shortcode is used to add a contact form to a post without you having to worry about any coding. All you need to do here is set the email address you want the emails to be sent to (if different from the default one), and the subject of the email, which might change depending on the post.
Step 13) On this section of the Shortcode option, you can create columns for your pages to divide them up as you see fit. You can add up to six columns per post.
Step 14) By setting the Tab Shortcode, users can create tabs for content without using up lots of space on the page. When these tabs are clicked upon, they open up and reveal the content, then close when you go back to the post.
Step 15) The List Generator Shortcodes can be used to create lists on your posts that include tick lists, bullets and numbering. Simply choose which one you would like to appear on your post and click on it. This will add it for you.
Step 16) Using the Dividers section, you can create Horizontal or Flat dividers that are built to break up the text on your post in a similar way to the columns. The horizontal option has a border, whereas the flat divider does not.
Step 17) A very cool feature is the ability to add Social Media buttons to your post. This allows you to add buttons throughout your posts, and enables you to post specifics about the post, rather than just the entire post. This is great if you have posts with multiple products on them. We will take you through each button individually.
Step 18) The Social Icon Shortcode is used for specific single social networks. You simply have to add in the details (including adding a social profile link and an icon image) and hit Insert. This is especially useful if your social profile isn’t one of the big ones from the list (e.g. Instagram, GoodReads, etc.)
Step 19) Add your Twitter info to create a shortcode for your Tweets. You can add Hashtags and user profiles to the posts too, and include your Follower count. This is great for showing off your Twitter prowess to your customers in your posts.
Step 20) Create a Follow button for Twitter using the details provided. This saves the user having to leave the page to Follow you on Twitter, and keeps them looking around your site.
Step 21) Add Digg Shortcode so that people can share your content to Digg more easily. You can alter the size of the icon and add a link to your Digg account.
Step 22) By adding a Facebook Like Shortcode, your customers can Like your content and your Facebook page without leaving your website. You can change the style so that the FB info appears as a box (with icons of other people who Like your account) or as a simple Like button.
Step 23) Share buttons are extremely popular, and by adding this shortcode, you make it easier for your customers to share info from your site to their Facebook friends. You can alter the code to make the share function wider, and change it from a button to an icon.
Step 24) If you are an active LinkedIn user, you can add shortcode so that your customers can share any of your content to their LinkedIn accounts. Simply add the URL you wish your users to share, and all they have to do is hit the share button.
Step 25) Google+ has a +1 function that is similar to a Facebook Like or a Tweet, and all you have to do to make this button available on your site is to add the URL that you want your customers to share when they hit the +1 option on your site.
Step 26) The Stumble Upon Shortcode works in the same way as Digg, LinkedIn and G+ shortcodes. Simply add the URL and make any changes to the design and folks will be able to share your content to Stumble.
Step 27) Pinterest pins are a great way to get your content shared, and by adding the URL of an image to the option below, you can get your posts shared across the most visually impressive of all the social networks, which in turn could lead a lot of customers your way.
This concludes our guide of the Woo Framework plugin.