Using span style in shortcode

  • Resolved Richard Slade

    (@raslade)


    8 years, 8 months ago

    Hi Guido

    I’m looking at styling some of the headings so that they appear in a different colour depending on which category is selected. I’ve tried adding a span style in the shortcode but no luck. Do you know a way to implement or is it not impossible?

    Thanks
    Richard

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author Guido

    (@guido07111975)

    8 years, 8 months ago

    Hi Richard,

    In next update I will wrap variables date, time and location in span tags, so you can apply custom CSS to them, instead of to whole labels. Is that what you want?

    Currently I’m trying to solve another issue, regarding pagination on homepage.. So when I have a fix, I will update plugin asap.

    Guido

    Plugin Author Guido

    (@guido07111975)

    8 years, 8 months ago

    Hi again,

    But if you want to apply custom CSS depending on which event category page visitor is, I advice you to use the body class.. because an unique class is added to the body class.

    
<body class="archive tax-event_cat term-my-category etc etc">

    The “term” = your event category.

    Guido

    Thread Starter Richard Slade

    (@raslade)

    8 years, 8 months ago

    Hi Guido

    Yes that could work, hopefully if it allows customisation between different categories on the same page.

    With the body class option – is this before the shortcode brackets?

    Thanks
    Richard

    Thread Starter Richard Slade

    (@raslade)

    8 years, 8 months ago

    Ok i’ve got a simpler option. I’ve wrapped the shortcode with a div and targeted the right label with CSS. Sorted.

    Thanks
    Richard

    Plugin Author Guido

    (@guido07111975)

    8 years, 8 months ago

    Hi Richard,

    In this situation I prefer using the body to add custom CSS.

    Let’s say you have a category (a slug) called “my-category” and you want to change the colour of the Time label… this should work:

    
.term-my-category .vsel-meta-time {color:#cc0000;}

    After my theme-update you can also add custom CSS to the time variable itself:

    
.term-my-category .vsel-meta-time span {color:#cc0000;}

    Guido

    Thread Starter Richard Slade

    (@raslade)

    8 years, 8 months ago

    Thanks Guido

    Yes this is what I’ve ended up doing for now but a span option would be very useful.

    Thanks
    Richard

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

The topic ‘Using span style in shortcode’ is closed to new replies.