SHARE

Hey gang, in this PSD to WordOPress tutorial, I’ll be styling up the custom field ratings that we added into the homepage in the last lesson. The ratings will be styled using a background image which auto repeats, and given a set width based on the dynamic class that is fed through from the custom field.

SUBSCRIBE TO CHANNEL – https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg?sub_confirmation=1

========== JavaScript for Beginners Playlist ==========

https://www.youtube.com/playlist?list=PL4cUxeGkcC9i9Ae2D9Ee1RvylH38dKuET

========== CSS for Beginners Playlist ==========

https://www.youtube.com/playlist?list=PL4cUxeGkcC9gQeDH6xYhmO-db2mhoTSrT

========== HTML for Beginners Playlist ==========

https://www.youtube.com/playlist?list=PL4cUxeGkcC9ibZ2TSBaGGNrgh4ZgYE6Cc

========== The Net Ninja ============

For more front-end development tutorials & to black-belt your coding skills, head over to – https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg or http://thenetninja.co.uk

========== Social Links ==========

Twitter – @TheNetNinja – https://twitter.com/thenetninjauk

2 COMMENTS

  1. Hi

    Why css script not working for me:
    /* this script front-page.php */
    <li>
    <?php the_post_thumbnail(); ?>
    <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
    <span><?php echo get_post_meta($post->ID, 'price', true); ?></span>
    <span class="star-<?php echo get_post_meta($post->ID, 'rating', true); ?> rating"></span>
    </li>

    //this is css script

    .star-5{
    width: 60px;
    }

    .star-4{
    width: 48px;
    }

    .star-3{
    width: 36px;
    }

    .star-2{
    width: 24px;
    }

    .star-1{
    width: 12px;
    }

LEAVE A REPLY

Please enter your comment!
Please enter your name here