3

I am using SharePoint 2013 Foundation and SharePoint Designer. I have a site collection with a subsite that contains wiki pages. I'm trying to change some of the styles on the wiki pages (like header margins, font sizes, etc.) using a CSS file, but I can't for the life of me figure out how to get the CSS file referenced to in the master file.

The root site is using the seattle theme, while my subsite is using the oslo theme. I'm not sure if this effects where I need to put the CSS reference.

I've already done tons of research on this, and I've found that the SPURL tags don't work for foundation, so I need a workaround.

This is what I'm currently using in the seattle.master file:

        <SharePoint:CssRegistration Name="Themable/corev15.css" runat="server" />
    <SharePoint:CssRegistration Name="/Style Library/Custom.css" After="corev15.css" runat="server" />
</head>

And I have this in the Oslo.master file, though I've tried the same thing in just one and the other:

    <SharePoint:CssRegistration Name="Themable/oslo.css" runat="server" EnableCssTheming="true" />
<SharePoint:CssRegistration Name="/Style Library/Custom.css" After="corev15.css" runat="server" />

Here's the CSS I'm using in my Custom.css file:

h1.ms-rteElement-H1 {
color: #000000;

}

The header insists on staying blue.

  • Please check if CSS file is loaded using browser developer tools. – Amal Hashim May 29 '15 at 23:56
5

As a best practice, please make a copy of your seattle and oslo master pages. Change your site to inherit from your copy of seattle/oslo master page.

In my case, I opened the custommaster.html and inserted the below CSS line

<!--SPM:<SharePoint:CssRegistration name="&#60;% $SPUrl:~sitecollection/Style Library/custom.css %&#62;" runat="server" after="SharepointCssFile"/>-->

As the path suggests, I uploaded the custom CSS file under ~sitecollection's Style Library. Also note that the CssRegistration name attributes considers encoded values for < and >.

  • 1
    The SPUrl apparantly doesn't work for SharePoint Foundation. Also, I don't seem to have any .html files in the Master Pages section of SharePoint Designer. – MO Editor Jun 23 '15 at 22:27
1

Okay, I finally got this to work. I'm going to post a detailed step-by-step way I did this. The problems I've been having seem to mostly be related to not understanding a lot of the terminology/locations of things. Hopefully this will help anyone else still new to everything.

I opened the main site in SharePoint Designer 2013, then opened the Master Page Gallery. I then created a folder called "Style Library" within the gallery.

enter image description here

I then opened notepad a wrote some CSS in there. To test, I made all p tags yellow. I then saved the file as CustomStyle.css, and uploaded it into the new Style Library folder I had just made (you can just drag and drop it).

I then opened the seattle.master page (after creating a backup by copy/pasting) and inserted the following:

<SharePoint:CssRegistration Name="Themable/corev15.css" runat="server" />    
<SharePoint:CssRegistration Name="/_catalogs/masterpage/Style Library/CustomStyle.css" runat="server" after="corev15.css"/>

The first line in the above code snippet already exists in the master file, the second line should be added below it.

Just save and refresh your SharePoint page. It worked for me in 2013 Foundation.

  • when uploading my css file it doesnt show up in Style library folder but if i try uploading again it tell me to replace the file..IS that a bug or something is terribly wrong here? @MO Editor – Keshav Taurah Aug 29 '17 at 11:30
0

I am not using publishing site. So my solution is different.

solution:

The InfoPath form is being rendered on page such as: http://serverName/_layouts/FormServer.aspx. This page locates at C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\FormServer.aspx. We just need to inject the below CSS code in the header section of the page, to force the textarea automatically wrap regardless.

style type="text/css" textarea{white-space: pre-line !important;} /style

Same code to be added into C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\PrinLoader.FormServer.aspx, so that the print view will behave the same way.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.