{"id":1742,"date":"2019-09-14T15:09:11","date_gmt":"2019-09-14T07:09:11","guid":{"rendered":"https:\/\/www.techcoil.com\/blog\/?p=1742"},"modified":"2020-05-12T13:25:20","modified_gmt":"2020-05-12T05:25:20","slug":"how-to-create-a-carousel-in-wordpress-with-slide-anything","status":"publish","type":"post","link":"https:\/\/www.techcoil.com\/blog\/how-to-create-a-carousel-in-wordpress-with-slide-anything\/","title":{"rendered":"How to create a Carousel in WordPress with Slide Anything"},"content":{"rendered":"

When you have been adding content to your website for some time, you may notice two things:<\/p>\n

    \n
  1. There are many pages that are never visited in months or even years.<\/li>\n
  2. The home page will always have page views.<\/li>\n<\/ol>\n

    Given these points, the home page is one place where you have the chance to promote pages that are rarely seen organically.<\/p>\n

    If your website is realised by polyglot stack, then you will find the Slide Anything plugin<\/a> useful for creating a Carousel for your WordPress instance.<\/p>\n

    Given that, this post shows how you can create a Carousel in WordPress with Slide Anything.<\/p>\n

    \"Sample<\/p>\n

    Installing Slide Anything in your WordPress instance<\/h2>\n

    First, find Slide Anything plugin from your WordPress's Add Plugins page:<\/p>\n

    \"Slide<\/p>\n

    Once the plugin appears in the search results, click Install Now<\/strong>. After the installation is completed, click Activate<\/strong> to activate it.<\/p>\n

    Accessing the SA Sliders dashboard<\/h2>\n

    After you had activated the plugin, you should be able to find SA Sliders<\/strong> link on the left.<\/p>\n

    Click on the link to get into the dashboard:<\/p>\n

    \"WordPress<\/p>\n

    When you get to the SA Sliders<\/strong> dashboard, you should see Sample Slider<\/strong> already created for you. This is a sample for you to get started with. Click on Sample Slider<\/strong> to see how you can add slides to your Slider:<\/p>\n

    \"Edit<\/p>\n

    You can preview how the slider \/ carousel looks like by clicking on Preview Slider<\/strong> at the top right corner of the screen.<\/p>\n

    In addition, you can decide how many slides to display at once for each device orientation under the Items Displayed<\/strong> section of the screen.<\/p>\n

    In the Slides<\/strong> section of the slider instance that you are creating, you get to add \/ remove slides from your slider. <\/p>\n

    For each slide, you are able to define the HTML content and some properties of the slide.<\/p>\n

    \"Screenshot<\/p>\n

    Linking the slide to a web page<\/h3>\n

    There are two ways to link the slide to a web page.<\/p>\n

    You can either do so with the Slide Link<\/strong> controls <\/p>\n

    \"Screenshoit<\/p>\n

    or include an anchor element within the HTML content.<\/p>\n

    Personally, I prefer to include an anchor element within the HTML content as that will allow me to decide which element will navigate the user to the web page.<\/p>\n

    Saving changes to your slider \/ carousel instance<\/h3>\n

    Once you are done with the changes, you can click on Update<\/strong> at the Publish<\/strong> section of the screen:<\/p>\n

    \"Screenshot<\/p>\n

    Creating a new slider \/ carousel instance<\/h2>\n

    If you choose to create a new slider instance, you can click on Add new Slider<\/strong> link under SA Sliders menu at the left or the Add new Slider<\/strong> link at the top of the slider listing page.<\/p>\n

    Once you do so, you will be presented with a similar interface as the Edit Slider<\/strong> page.<\/p>\n

    \"Add<\/p>\n

    After you are done with configuring your new slider, click on Publish<\/strong> under the Publish section.<\/p>\n

    Displaying your slider \/ carousel instance within your WordPress theme pages<\/h2>\n

    When you have created a slider \/ carousel instance, the final step will be to display it in a page of your choice.<\/p>\n

    For example, if I want the carousel instance to appear in the index page, I will edit index.php<\/code> of my active theme.<\/p>\n

    To display the carousel instance, first find the Shortcode<\/strong> at the top right corner of your slider configuration screen:<\/p>\n

    \"Screenshot<\/p>\n

    Once you have the short code, you can use the do_shortcode function<\/a> to display the carousel instance:<\/p>\n

    \r\n<?php \r\necho do_shortcode('[slide-anything id="284"]');\r\n?>\r\n<\/pre>\n\n