Font font and font size in sidebar widget

[jornostvik]

Hello

I am using the Events Calendar PRO together with the add-on The Events Calendar Category Colors. The venue description takes attention from the event date and the title of the event, see mosaictrondheim.no. How do I want to change the font and the font size for the venue in the sidebar widget?

I appreciate if someone could give some good advice.

Regards,
Jørn.

[Brian]

Hello,

I can help you out here.

Looks like your theme has come css that is change the Venue names.

I found this css may work to change it to what you would like:

.tribe-events-adv-list-widget span.fn.tribe-venue a {
font-size: 20px;
}

Add that css to your theme’s stylesheet or through a plugin such as Simple Custom CSS.

Let me know if that helps.

Thanks

[jornostvik]

Thank you very much for the tip! It solved my main issue. However, I have two addtional questions:

1. How to I change the venue text from uppercase to lowercase letters?
2. How do I remove the date placed above the event title (e.g. “søn 1” above “Mosaic Matprat. 1. mars…”)? I only want to have the date placed below the event title, not both above and below.

Regards,
Jørn.

[Brian]

I can point you in the right direction on those two points:

1. How to I change the venue text from uppercase to lowercase letters?

You can add the following css in the selector I already gave you to change the all uppercase.

http://www.w3schools.com/cssref/pr_text_text-transform.asp

2. How do I remove the date placed above the event title (e.g. “søn 1″ above “Mosaic Matprat. 1. mars…”)? I only want to have the date placed below the event title, not both above and below.

Try this css for that:

.tribe-events-adv-list-widget .list-date {
display:none;
}

Thanks

[jornostvik]

Thank you. As a novice on CSS I really appreciate your support. My very last questions are as follows:

1. How do I place the weekday (e.g. Sunday) before the event date, at the same line?
2. How do I remove the vertical space between the event date and the event venue? I want the line height to be singel.
3. How do I customize the event venue to be the same font as the event date?

Best regards,
Jørn

[Brian]

Unfortunately, I am not able to help with all the customizations.

I have gotten you started, but it is beyond our terms of services to help with everything.

So you are going to have to take it from here to modify everything the way you would like.

Using the Chrome Developer Tools or another browsers is one method to learn how to find the css to make changes to it:

Using Google Chrome Developer Tools

You can follow our themer’s guide to move and edit templates:

https://theeventscalendar.com/knowledgebase/themers-guide/

Thanks

[jornostvik]

Thank you for the tip. I solved two of the three issues.

Regards,
Jørn.

[Brian]

I am glad to see you were able to figure it out.

I am going to go ahead and close this ticket. If you have a similar issue or another in the future, please do not hesitate to create a new ticket.

Thanks!

[Author]

Posts