Build Your Own Business Website header image

WordPress Events Calendar Plugin – Part 3 – Style the calendar

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Applies to -

Whoops, you've found some premium content!

Watch the opening clip of this video to preview it,
the full video is available to paid members.

This is the third part of the WordPress Events Calendar Tutorial series. In this session, we show how to style your events calendar by going to the Style Setup of the plugin.

Video Transcript

I think we will come down here and take a look at settings for a second though. Now that we’ve made up our mind about styles, let’s see… we’re going to say 695 and let’s see, font, date, numbers. We can take that up to 18 points and see what happens. Let’s go ahead and save those changes. Come back over here and once that’s done, refresh this.

Okay so now we have… you could easily scroll back, scroll forward and people can jump forward to see what’s going on. If you click on this then information drops down… and so these numbers… I think it would be more interesting since we’ve got such a wide calendar, it would be more interesting if these numbers were larger. And I wonder if that’s… the calendar date, either larger or smaller. Either it goes all the way across in one fell swoop or it goes in two but this is kind of funny looking.

So maybe what we do then is we come back around, look at this for our… go back to settings for a second and styles and main date font size. Oh this is… oh no. If we take this down say to 36, what am I looking at here, I wonder? I wonder if this documentation shows any of that stuff. Not really. It doesn’t really have any documentation on that. But if we were to… let’s just play with it. Let’s just explode one of those things. Font size, date, main font size, date numbers, day name, month name, day number. Let’s take that one up to 36 as well. Let’s just see what happens when we do this, 36 and 36.

Okay well that actually… that did increase the size of this although it makes them unreadable and they still stretch all the way across. Oh, this was the day number that went down when we decreased that. Okay so this… well, it used to be 50 and this used to be something else. So if we go back over to our styles and we go back over to… I think actually, 50 was fine for that. But we take our font size down say to 14 and then maybe we’ll save that. I guess there doesn’t appear to be any way to make these numbers go all the way across. This is going to show 28 whether I liked it or not. And ten if we click on that and we want to go to Learn More, let’s just test to see whether or not this can take HTML or not. Let’s see, here is a link so we’ll copy that link. We’ll come back over here to our settings for this thing and go to our events and we’ll edit this and paste this.

Join us in the boardroom Q&A success coaching so there is the page. Okay, learn more and sign up for the event, for the call. Let’s do that. Let’s see whether or not the HTML thing works properly for this. Oh actually, I should have changed the date also. We might as well do that real quickly. So instead of 7:30, it’s actually… what is it, 19:30? Hit save. Refresh.

There it is. Looks like this works just fine. Looks like HTML works fine. If we click on this, it’s going to take us off to the… yeah, takes us off to the signup page. And so any kind of HTML would really work for that. We can do the same thing here.

And then I think actually, what we could do would be to essentially repeat this for the 19th, 20th, and 21st so that we have 3 full-day events going on here. And we’ll just stack… we’ll just call this VIP Marketing Retreat Day 1 and then Day 2 and then Day 3 and we could put those all in there. And then we could put the HTML in.

So I think actually that looks like that might work just fine. We’ll have to let her see it and see what she thinks.

0 Comments… add one
0 comments… add one

Leave a Comment