Add Wooslider PHP to your index template

Ok so here’s another of my probably wrong and misguided posts instructing you how to add Wooslider to your WordPress site.

If I’m wrong on anything, let me know in the comments below :D

A few people asked how to add the code to your site. Well, you simply need to add the slider into the page code where you want it to appear.

Basic embed code is:

<?php wooslider(); ?>

This should display the slider in your template wherever you place it.

Nobody wants to use that though, so use my previous post (and particularly the comments from Ben!) to create the embed code you really want using shortcodes.

Something like this:

<?php if (function_exists(‘wooslider’)) echo do_shortcode(‘[wooslider slider_type="posts" limit="3" link_title="true" layout="text-bottom" overlay="full" category="homepage-feature-post"]‘); ?>

Ok, I read the last post…I get it. But now what?

Ok this is probably easier than you think.

To add it to the index page of Mystile, log into WP admin and browse to Appearance > Editor

Open up the Main Index Template (index.php)

When you open it, each ‘piece’ of PHP code is a section of the page. The top one gets the header, the next one gets the content.

You probably want to add your slider above the content section.

See the pic below (click for embiggenness)

You can see that I have added the code in a div that I have chosen to call “wooslider”. You don’t HAVE to do this, it will work if you just stick the PHP code in there without any divs at all. The nbenefit if you do is that you can style the div with CSS.

I suggest you do.

You can then open up your CSS (or child CSS) file and add some styling for the slider.

See the pic below (click for biggerosity)

So. That’s it. Probably full of errors and probably not the best way to do it but that’s my method and it works for me.

Hope it helps :D

This post was written by

avatarJim O – who has written posts on SuperCreatives.
Hi I'm Jim and I run SuperCreatives which is basically me tapping at a keyboard and sometimes talking to people and working on stuff that helps people sell, communicate or promote things online. If you need to sell, communicate or promote things online...get in touch!

Email

5 comments

  1. wow, thanks Jim O!!

    i’ve tried this by copy-paste your code on this post, but unfortunately there is a parse error, and after i checked, the ‘ sign should change manually by us, after that there is no problem.. :D

    i basically used this methode on my online store. :)

    thanks.. really thanks.. finally i can add wooSlider on my Mystile WooCommerce theme. :D

    regards,

    Ocean7Cloth.Com

  2. avatar Murtaza says:

    I am having issues with this. I tried exactly how you showed on your posts. The Code I have added is,

    When I open the Page Source, it shows this,

    Data

    ‘Data

    Data

    I am new to php and dont know a lot about it. I have added the images i need in the featured image. It only shows 2 lines on the page.

    Note: I have Kaya Slider on the theme by default whose code i removed.

  3. avatar Jim O says:

    Glad to hear you got it sorted eventually :D

  4. avatar Jim O says:

    Hi Murtaza. ‘Data, Data, Data’? It sounds like something is wrong, and it probably relates to the theme. Try it on a different page template or using a different theme – perhaps a default theme like TwentyTwelve or a development theme with minimal functionality.

  5. avatar Jose says:

    Hi!!! i try to embed that code but doesn’t show the slide, even load dthe plugin (i know because show the white borders) but doesn’t show the slides please help me :(

Post a comment

Copyright © SuperCreatives
Tidy stuff from Cardiff

Built on Notes Blog Core
Powered by WordPress