WordPress.org

Ready to get started?Download WordPress

Forums

Network Latest Posts
[resolved] Layout question (7 posts)

  1. Ronaldus
    Member
    Posted 1 year ago #

    What a very nice plugin this is!! Thank you for your work on this!!

    I would like to make it look like the footer of http://leef.inaandacht.nl : the thumbnails right (or left) from the text and not above it.
    Is this been done before and can I view the code adjustments that have to be made?

    Thanks in advance and kind regards,
    Ronald

    http://wordpress.org/extend/plugins/network-latest-posts/

  2. Jose Luis SAYAGO
    Member
    Plugin Author

    Posted 1 year ago #

    Hello Ronald,

    You just have to play a little bit with the classes, you can create a new css file and save it inside your main theme folder, then add some css classes there to style the output the way you want it, for example I created a file called test.css (inside my active theme folder) then I used the styling below:

    .nlposts-ulist-container .nlposts-ulist-thumbnail-litem a > img {
    display: block;
    padding: 4px;
    line-height: 1;
    border: 1px solid #ddd;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075);
    max-width: 100%;
    float:right; /* put the thumbnail on the right */
    top:3% !important;
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(1); /* Google Chrome & Safari 6+ */
    opacity: 0.7;
    }
    .nlposts-ulist-container .nlposts-ulist-thumbnail-litem h3 {
    float:left !important;
    margin-top: -90px !important;
    width:80% !important;
    }
    .nlposts-ulist-container .nlposts-ulist-thumbnail-litem ul {
    float: left !important;
    margin-left: 0 !important;
    margin-top: -50px !important;
    width:80% !important;
    }
    .nlposts-ulist-container .nlposts-ulist-thumbnail-litem .nlposts-ulist-meta {
    float:left !important;
    margin-top:-65px !important;
    font-size:12px !important;
    }

    Then I used this shortcode: [nlposts title_only=false thumbnail=true css_style=test excerpt_length=22 full_meta=true sort_by_date=true], you can see the results here: CSS Test.

    Of course those margins will depend on your thumbnail sizes and the text length, however you have something to get started, and remember when you use a custom css file it will affect all NLPosts instances within the same page.

    Cheers.

  3. Ronaldus
    Member
    Posted 1 year ago #

    WOW !!!
    That test looks great!!
    I'll experiment with this the coming week and report back to you.
    Thanks a lot for now !!

  4. Ronaldus
    Member
    Posted 1 year ago #

    OK, seems the css has some more consequences in combination with my theme, see http://www.inaandacht.nl.
    But first this: do you have an email and PayPal account so I can donate?

    Cheers,
    Ronald

  5. Jose Luis SAYAGO
    Member
    Plugin Author

    Posted 1 year ago #

    Hello Ronaldus,

    You can visit my website L'Elite where you can find my email & the PayPal button for donations.

    I've checked out your website, it looks good, what consequences have you noticed?

    Cheers.

  6. mcmikemn
    Member
    Posted 1 year ago #

    I'm trying to customize some of the CSS as you describe here, but when I add a css_style attribute to my nlposts shortcode, the post doesn't appear to load my style sheet.

    I'm using this shortcode:
    [nlposts css_style=nlposts_style_mods instance=recent-posts number_posts=5 time_frame=7 title_only=false blog_id=2 category="share-with-bardo-project" display_content=true excerpt_length=100 auto_excerpt=true sort_by_date=true full_meta=true sorting_order=newer]

    My custom stylesheet is called nlposts_style_mods.css and is in the root directory of my theme folder.

    When I reload my post with this shortcode (even after deleting my site's cache) and check the source, there is no mention of nlposts_style_mods.css anywhere - not a <link rel='stylesheet'...> reference or anything.

    What am I doing wrong? Thanks for your help.

  7. Jose Luis SAYAGO
    Member
    Plugin Author

    Posted 1 year ago #

    Hello mcmikemn,

    Is your server or your site using some sort of cache system? if that's the case, try to flush your cache and try again. Your shortcode seems to be right. Can you share the URL of your site? If you don't want to share it publicly, you can send an email to opensource@laelite.info.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic