Upcoming Events widget styling

  • Resolved clairelt

    (@clairelt)


    3 years ago

    Hello. I’d like to use the upcoming events widget on my sidebar but the text is too large and I’d like to add a line break between the time/day line and the event details link. I’m currently copying the events from the widget then pasting and styling them separately but it means I have to update manually which is a pain

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Joe Dolson

    (@joedolson)

    3 years ago

    My Calendar doesn’t include any styling for the upcoming events list, so that’s most likely all coming from your theme. Without seeing it, I can’t really make a lot of suggestions, but you’ll need some CSS to adjust the look.

    Thread Starter clairelt

    (@clairelt)

    3 years ago

    It has a template and appears as a list – where does it get that from? I don’t want it to be a bullet point list, and I want a line break after the date, here are some screen shots:

    This is the default look as a list:

    This is the template:

    and this is what I’d prefer it to look like:

    Plugin Author Joe Dolson

    (@joedolson)

    3 years ago

    Yes; the list is outputted as an unordered list, then the styling is provided by your theme or browser defaults. You can change the look of it using CSS, such as

    .upcoming-events {
    list-style-type: none;
}

    You may need a higher level of specificity.

    You can get the line break you want by adding a <br> after the closing </strong> tag in the template.

    Thread Starter clairelt

    (@clairelt)

    2 years, 11 months ago

    Just in case anyone else has this question, I adjusted the styling in the widget template like this:

    “<p class=”has-small-font-size”>{timerange after=”, “}{daterange}
    {linking_title}</p>”

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

The topic ‘Upcoming Events widget styling’ is closed to new replies.

Tags