It is SHORTY-TIME!

In this blog post I want to show you how you can modify you weekend in the calender view to make it more user friendly. Therefore we will make the weekend background grey.

As most of the time we will start at the very first steps. Go to the site where you want to add your calender, click on Site Contents and then click on “add an app”.

Colored-Calendar-weekend-en_1

Under the heading “Apps you can add” select the Calendar.

Colored-Calendar-weekend-en_2

Give your calendar a name (I choose “Test Calendar”) and click on “Create”.

Colored-Calendar-weekend-en_3

Now you get redirected to your App overview. Click the Title or the Tile of your new created calendar.

Colored-Calendar-weekend-en_4

You can edit your page after clicking on the cogwheel next to your name and click then on “Edit page”.

Colored-Calendar-weekend-en_5

Click on “Add a Web Part” (1). Under Categories select “Media and Content” (2), then select “Content Editor” (3) and then click on “Add” (4)

Colored-Calendar-weekend-en_6

Now click inside the Content Editor onto “Click here to add new content”.

Colored-Calendar-weekend-en_7

The ribbon should now be visible. Click in there “Edit Source”.

Colored-Calendar-weekend-en_8

All we need is a frieeend *sing*…. ups wrong text, all we need is a little CSS here.
This will look for the columns Saturday and Sunday and changes the background color.
You can change the color by yourself. Just change the value #ebebeb to a value of your choice.

Colored-Calendar-weekend-en_9

Click after that in the Content Editor onto “OK”. Now you should already see, that it worked.

Last but not least click in the ribbon onto “Page” and then “Stop Editing”.

Colored-Calendar-weekend-en_10

Now you are done!

Colored-Calendar-weekend-en_11

I hope you liked this AfraIT Shorty.
Also I would love to see, if you share this blog post in your social networks or if you comment this post below

LEAVE A REPLY

Please enter your comment!
Please enter your name here