WordPress.org

Ready to get started?Download WordPress

Forums

Single Latest Posts Lite
Change the CSS style for pagination (4 posts)

  1. d_alinus2004
    Member
    Posted 5 months ago #

    Hello,

    Please let me know how i can change the css style for pagination ?!

    Many regards

    https://wordpress.org/plugins/single-latest-posts-lite/

  2. Jose Luis SAYAGO
    Member
    Plugin Author

    Posted 5 months ago #

    Hi, you could create a custom CSS stylesheet and set it through the css_style parameter.

    Take a look at the default stylesheet and tweak the pagination classes at will: slposts-default_style.css.

    Then save your custom CSS file into your active WordPress theme folder (where style.css if found), and set it in your shortcode (or widget):

    // Shortcode example for a custom CSS named custom-slposts.css
    [slposts paginate=true posts_per_page=4 css_style=custom-slposts]

    I hope this helps.

    Best regards,
    José SAYAGO.

  3. d_alinus2004
    Member
    Posted 5 months ago #

    Hello,

    still dosen't work.

    so, what i do ?!

    1: I just copy all the code from here: https://gist.github.com/laelitenetwork/7478263#file-slposts-default_style-css-L159 In my CSS style file for the theme.
    2: I have put in my page next code: [slposts paginate=true posts_per_page=4 css_style=slp-pagination]

    No result.
    Please let me know if you can help me again.

    Many regards

  4. Jose Luis SAYAGO
    Member
    Plugin Author

    Posted 5 months ago #

    Hi, after downloading the CSS file (which I suppose you saved as slp-pagination.css) you must tweak the pagination classes to match the styles in your theme. Below you'll find which classes you should modify for pagination:

    /*\
     * --------------
     * | Pagination |
     * --------------
    \*/
    .slp-pagination {
        ... your rules here for pages DIV container ...
    }
    .slp-pagination ul {
        ... your rules here for pages UL wrapper ...
    }
    .slp-pagination li {
        ... your rules here for pages LI wrapper ...
    }
    .slp-pagination a,
    .slp-pagination span {
        ... your rules here for pagination links ...
    }
    .slp-pagination
    a:hover,
    .slp-pagination
    .current {
        ... your rules here for current page link on hover ...
    }
    .slp-pagination
    .current {
        ... your rules here for current page link ...
    }
    .slp-pagination span,
    .slp-pagination
    .disabled a,
    .slp-pagination
    .disabled a:hover {
        ... your rules here for disabled link ...
    }
    .slp-pagination li:first-child a,
    .slp-pagination li:first-child span {
        ... your rules here for the first link in list ...
    }
    .slp-pagination li:last-child a,
    .slp-pagination li:last-child span {
        ... your rules here for the last link in list ...
    }

    Cheers.

Reply

You must log in to post.

About this Plugin

About this Topic

Tags

No tags yet.