New to the community? Start here

Reader Look and Feel

Hi,

I need someone to help me with the CSS to get a look and feel, like the one Edublogs has with its reader plugin. It includes pictures, and has much nicer look.

Thanks

  • Predrag Dubajic
    • Support

    Hi Prueba,

    Hope you're doing well.

    I'm afraid that the Edublogs reader is a customized to adjust the needs for that site and there's no code we could share to apply on your own site.

    I have poked around a bit and here's some CSS that will help you started with that and you can adjust it further for your needs:

    /* Title */
#poststuff .msreader-post .msreader-post-content h2 {
    font-size: 15px;
}

/* Content */
#poststuff .msreader-post .msreader-post-content .msreader-post-excerpt p {
    font-size: 13px;
    font-family: Helvetica;
}

/* Hide avatar and set meta in one row */
#poststuff .msreader-post-meta .inside > img {
    display: none;
}

#poststuff .msreader-post-meta .inside .vertical-middle > a:first-of-type:after {
    content: "in";
    margin-left: 3px;
    display: inline-block;
    color: #000;
}

#poststuff .msreader-post-meta .inside .vertical-middle > br {
	display: none;
}

    To add this code you can use our Ultimate Branding plugin and its Admin CSS module.

    What I noticed during the testing is that the image is not being called and it looks like this is a bug within Reader plugin so I have reported it to our developers to check it out.

    Best regards,
    Predrag

  • Predrag Dubajic
    • Support

    Hi Prueba,

    I'm afraid that we don't have such list but you can easily find this by checking the HTML structure of the page with browser inspector.
    Right click on any element in Reader and select Inspect, this will open up the dev tools and from there you can find the class/ID you need for that element:

    Best regards,
    Predrag

Thank NAME, for their help.

1 Point
5 Points
15 Points
Other

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.