Support

Home Forums Event Espresso Premium Upcoming Events Widget Format

Upcoming Events Widget Format

Posted: October 3, 2016 at 5:57 am

Viewing 10 reply threads


emiliopandika

October 3, 2016 at 5:57 am

Hi,
I start using EE4 and love it. My question are:
1.the upcoming_event widget on the front-end showing bullet that seems make the event list goes to the next line. So it appeared there are gaps between event list.
https://postimg.org/image/qg9n8dy3j/
How do I work around this?
2. Can I change the style of the bullet?
3. Thank You.


Tony

  • Support Staff

October 4, 2016 at 3:42 am

Hi there,

EE takes most of the styling from your sites theme and applies on minimal styles where needed so its likely the styles are from your theme.

You can use some custom CSS to change the styling but we will need to see the page to help, can you post a link we can use to view this please?


emiliopandika

October 4, 2016 at 5:40 am

Hi Tony,
thank you for getting back to me.
This is the link for my website: healthlink.id

much appreciated
Emilio


Tony

  • Support Staff

October 4, 2016 at 5:48 am

Thank you.

However as the site is currently in maintenance mode (MM) we can’t see it, you will either need disable MM or send temporary login details we can use to view the site using:

https://eventespresso.com/send-login-details/


emiliopandika

October 4, 2016 at 6:11 am

Oh sorry,
I thought it was off already, my bad.
healthlink.id
its off now

Emilio


Tony

  • Support Staff

October 4, 2016 at 6:37 am

So the icon is being added by your theme:

.content_right ul li.dashicons-before:before, .content_right .shadowblock_out :not(.account-info) ul:not(.ads):not(.from-blog):not(.user-stats):not(.refine) li:before, #adv_categories .cat-item:before, .footer_main_res .column:not(.widget-125-ads) ul li:before, .maincat-list .subcat-list li:before {
    content: "\f345";
    font-size: 12px;
    vertical-align: text-top;
    width: 12px;
    padding-right: 3px;
}

EE removes the list styling from the widget, however your theme is adding an element before each li element with the above.

The best option is to remove that from the EE upcomng events widget, you can use:

.ee-upcoming-events-widget-ul li:before {
    display: none!important;
}

The additional spacing at the top of each event is from some styling within EE:

.ee-upcoming-events-widget-title-h5 {
    margin: 3em 0 0;
}

You can override that with something like:

.ee-upcoming-events-widget-ul .ee-upcoming-events-widget-title-h5 {
    margin: 1em 0 0;
    padding-top: 0;
}


emiliopandika

October 4, 2016 at 7:12 am

Hi Tony,

thank you for your prompt response.
I am very new to this, what should I do?
1. Add it to custom css?
2. Add it to Child theme?
3. Add it to the upcoming events widget php?
And which code should I add or change?
Much appreciated.

Sincerely,
Emilio


Lorenzo Orlando Caum

  • Support Staff

October 4, 2016 at 7:50 am

Hi Emilio,

If your theme has a Custom CSS area built-in, then you can add the CSS that Tony shared there through your WP dashboard.

Otherwise, you could use a free plugin that adds an additional stylesheet to your WordPress site such as Simple Custom CSS or Reaktiv CSS Builder.

You can then go back to your site and refresh the page to see the new changes.


Lorenzo


emiliopandika

October 4, 2016 at 9:03 am

Hi Tony and Lorenzo,

thank you so much for the help. It works.
A little problem tho, between image and dates there is no space. Seems like it stick together.

Much appreciated,
Emilio


emiliopandika

October 4, 2016 at 9:12 am

Hi Tony and Lorenzo,

I think it is not a problem, by changing the size of the images I can get over it.
Thank you so much for the help.

Sincerely,
Emilio


Tony

  • Support Staff

October 4, 2016 at 9:56 am

Hi Emilio,

Although you’be mentioned you can just use a different size image we can likely provide some CSS that will save you having to change the images however again we’ll need to see the site to do that.

If you could disable maintenance mode again I’ll take a look if you prefer.

Viewing 10 reply threads

The support post ‘Upcoming Events Widget Format’ is closed to new replies.

Have a question about this support post? Create a new support post in our support forums and include a link to this existing support post so we can help you.

Event Espresso