Support » Plugin: Single Latest Posts Lite » Change the CSS style for pagination

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Jose Luis SAYAGO

    (@iluminatus)

    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.

    Thread Starter d_alinus2004

    (@d_alinus2004)

    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

    Plugin Author Jose Luis SAYAGO

    (@iluminatus)

    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.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Change the CSS style for pagination’ is closed to new replies.