Adding CSS styles to PIS elements displayed through shortcode

  • Resolved vinzen

    (@vinzen)


    9 years ago

    Hi Aldo,

    I’m using the shortcode on pages to display/list the recent posts. I want to apply CSS styles to the output of the shortcode. How do I create a widget ID in the shortcode so the CSS styling is only applied to the shortcode output and not elsewhere, like the sidebar widgets. I’m able to apply CSS styling only to specific sidebar widgets, that works fine. Can I do the same with the shortcodes?

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Aldo Latino

    (@aldolat)

    9 years ago

    Hi Vinzen 🙂
    welcome back!

    You can use this technique for shortcodes in posts, for example:

    .post .pis-ul {
	background-color: #ff0000;
}

    and this for shortcodes in pages:

    .page .pis-ul {
	background-color: #ff0000;
}

    In other words, prepend the class .post or .page and then the class to modify, for example .pis-ul or .pis-li or .pis-title, and so on.

    The widgets in the sidebar should remain untouched.

    Let me know if you need more help.

    Thread Starter vinzen

    (@vinzen)

    9 years ago

    Thanks so much for the prompt response, Aldo.

    It worked like a charm. 🙂

    Plugin Author Aldo Latino

    (@aldolat)

    9 years ago

    You’re very welcome! 🙂

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Adding CSS styles to PIS elements displayed through shortcode’ is closed to new replies.