Monthly Archives: December 2014

SharePoint – Customize Wiki Headings with CSS

Hello everyone. Today I want to show you how you can customize the Wiki Headings of a SharePoint 2010 Wiki via CSS to make them look better.

Here you can see all Headings and Colored Headings in their default style. (Not really pretty in my opinion)

sharepoint_wiki_headings_before

To change this we will do the following:

First you need to enable the SharePoint Site Collection and SharePoint Site Feature called “SharePoint Server Publishing Infrastructure”.

Next we create our custom CSS File. I called mine “Wiki.css”. Here is the code:


.s4-recentchanges
{
display:none;
}

.ms-rteElement-H1
{
font-size:xx-large !important;
font-weight:normal;
font-style:normal;
}

.ms-rteElement-H2
{
font-size:x-large !important;
font-weight:normal;
font-style:normal;
}

.ms-rteElement-H3
{
font-size:large !important;
font-weight:normal;
font-style:normal;
}

.ms-rteElement-H4
{
font-size:medium !important;
font-weight:normal;
font-style:normal;
}

.ms-rteElement-H1B
{
color:#ff8c00;
font-size:xx-large !important;
font-weight:normal;
}

.ms-rteElement-H2B
{
color:#ff8c00;
font-size:x-large !important;
font-weight:normal;
}

.ms-rteElement-H3B
{
color:#ff8c00;
font-size:large !important;
font-weight:normal;
}

.ms-rteElement-H4B
{
color:#ff8c00;
font-size:medium !important;
font-weight:normal;
font-style:normal;
}

After you have finished creating your CSS file upload it somewhere to your SharePoint Site Collection.

Next go to Site Actions > Site Settings >  Look and Feel > Master page and select the CSS File “Wiki.css” we created and uploaded to SharePoint and click on OK.

sharepoint_css_navigation_setting

After you have finished the above steps your Wiki Headings will look like this:

sharepoint_wiki_headings_after

Much better than the default Headings right? Well that´s it. Now you know how to customize your Wiki Headings to create better Wiki pages. I hope you liked my post and I hope to see you again 🙂

Sources:

http://junestime.wordpress.com/2012/05/22/change-the-default-markup-style-3/

http://www.ironspider.ca/adv/cssproperties/fontstyles.htm

http://www.w3schools.com/cssref/pr_font_font-size.asp

Tagged ,

SharePoint – Toplink Fly Out Menus

Hello everyone,

today I want to show you something I found out about SharePoint when I played around with some features. I want to show you how you can enable Fly Out menus in your Toplink Bar without using SharePoint Designer.

Important: You need SharePoint Server. As far as I know this solution does not work on SharePoint Foundation.

The first thing you need to do is to go to your SharePoint Site and enable the Site Collection Feature and Site FeatureSharePoint Server Publishing Infrastructure“.

sharepoint_toplink_features

Now click on the Navigation link.

sharepoint_toplink_site_settings

Now create a new Heading under Global Navigation and add some links:

sharepoint_toplink_navigation

Now go back to your Site and have a look at the Toplink Bar. It should look like this:

sharepoint_toplink_links

That´s it. Pretty simple right? I hope you liked my post and I hope to see you next time 🙂

Sources:

I tried this when I had some free time 🙂

Tagged