How to: Add a Carousel Slider to Bootville Lite

Featured Theme Forums Bootville Lite How to: Add a Carousel Slider to Bootville Lite

This topic contains 0 replies, has 1 voice, and was last updated by  zeaks 1 day, 1 hour ago.

Viewing 1 post (of 1 total)
  • Author
    Posts
  • #17906

    zeaks
    Keymaster

    Bootville Lite will make use of the CTP Bootstrap Carousel plugin if it’s installed without the need to edit any template files. It will display exactly where the header image does and makes use of the Bootstrap 3 framework already installed in your theme.

    Download CPT Bootstrap Carousel

    • Visit Plugins > Add New in your WordPress Admin.
    • In the search field type (without quotes) “CPT Bootstrap Carousel”
    • Click Install and Activate

    Configure the Carousel

    After its installed visit Carousel > Settings in your WordPress Admin. Most settings should be fine the way they are. Scroll down to “Carousel Setup”. Under the section “Twitter Bootstrap Version” select 3.x (default) if it’s not selected already.

    Under “Image Size” using the dropdown menu select “Slider”. The rest of the settings are personal preference and fairly self explanatory. If you have any questions about the other settings feel free to ask here.

    Adding Images to the Carousel

    Visit Carousel > Add New. Enter a title and an excerpt if you like. To the right you should see “Set Featured Image” Click this and select any image you want displayed in the slider. Images should be at least 1,062px wide to fit within the slider area properly. All slider images are cropped to 1,062px × 350px.

    Below the “Set Featured Image” there is a section you can configure if you want to add a read more button and link it to a particular post or URL. This is optional

    Images are not cropping where I want

    The downside to having a set crop size is that WordPress doesn’t always select the area we want to be displayed, with a bit of work you can select the area you want. Here’s how.

    • After you selected your image, before selecting “Set as Featured Image” click “Edit Image”.
    • You’ll be brought to an edit screen. On the right where it says “Scale” in the width type 1062 if the height is more than 350 (that’s good) press the Scale button.
    • On the left where the image is, select and area by clicking and holding your mouse button, any size area will do.
    • On the right where it reads “Selection” in the first box type 1062, in the second box type 350. This will select the maximum width of the image. The height is your choice, 350 is just the recommended size for this theme.
    • Using your mouse on the image drag the selected area up or down until you have selected the best area to crop.
    • Once you have the area you want selected, above the image you’ll see icons, the first icon is the crop tool. Press it and click “Save”
    • Now you can select this image as the featured image for that slide.
    • Keep in mind if you have used this image for other areas of your site it will be cropped, so it’s best to upload a new image just for the slider. If you’ve accidentally cropped an image and want to revert it, visit the edit image screen and click “Restore”

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.