Tag Info

Hot answers tagged

10

Does SharePoint 2013 have support for responsive design or do you have to create it from stratch? No, there is no built in out of the box support for responsive design in SharePoint 2013. Responsive design is different from Mobile friendly design, and as such I think it's best to do your page layout and not rely on a framework. Others feel different, ...


8

I know you asked for 2013 but I'm leaving the 2010 one here too in case anyone go crazy like you did. 2010 When any ribbon tab is open (other than the 'browse' one) it forces a 135px height on its container, which is a sibling of the #s4-workspace container, see where I am going? #s4-ribbonrow[style='height: 135px;'] ~ #s4-workspace #s4-leftpanel { ...


8

you can use sprite cow to generate your css http://www.spritecow.com/


7

SPUtility provide us a method called - MakeBrowserCacheSafeLayoutsUrl(string, boolean) and other overload methods. Based on last modification this itself generate a MD5 hash code and append it to css or js urls. We don't have to worry about finding version numbers or generating id based on creation date, this is already handled. I have used this in my ...


5

There are custom SharePoint CSS classes that you may need to overwrite to change the colour of the hovering. Using IE developer tools I found that the two classes you're looking at are .ms-welcome-hover and .ms-siteactions-hover the welcome hover class obviously being the top bar for the page. This code in your custom CSS should change it to a blue ...


4

You can do so by using Delegate Controls which is by default included in master pages. There is a delegate control on master pages called AdditionalPageHead and it allows you to add multiple controls to it. This means you can write a SharePoint FEATURE and register your own control which adds references to the JS files. It is described in detail at: ...


4

As far as I'm aware, the crawler won't 'run' the javascript on the generated page, therefore this technique probably won't actually work. Can't you add a noindex class to the container div of the nav control on the masterpage?


4

Based on Zimmergren's blogpost regarding new delegate controls in SP 2013: Create a module with the following in the Elements file <?xml version="1.0" encoding="utf-8"?> <Elements xmlns="http://schemas.microsoft.com/sharepoint/"> <!-- DelegateControl reference to the SuiteLinksDelegate Delegate Control --> <Control ...


4

If you don't apply any particular style to a table inserted in a CEWP, it'll get applied the class ms-rteTable-default. So, instead of what you have done, you can override -in your custom css file- that class: .ms-rteTable-default{ -ms-name:"Tabell - test"; border:1px solid $borderColor; // sass syntax margin: 8px 0; width:98%; } Just make ...


4

Use SharePoint Designer and follow these steps: Connect to SharePoint site in SharePoint designer. On the left pane click All Files. Then on the list select "Style Library". Select the CSS file you want to edit and then click "Edit file". If check out is required it will do it for you after your confirmation. Make your changes, save the file, and don't ...


3

If it's SharePoint on-premises then the best way is to create a Solution with a Feature with a <Control> element targeting the AdditionalPageHead delegate control. Then you can easily turn it on/off and it works regardless of which master page you choose. For guidance see Adding jQuery to Every Page in SharePoint with Delegate Controls


3

Add New Item and add Sharepoint/Office Module type in project Add the Folders and Files to the Module In the elements file use this format:- <?xml version="1.0" encoding="utf-8"?> <Elements xmlns="http://schemas.microsoft.com/sharepoint/"> <Module Name="Scripts" Url="Style Library/Scripts"> <File ...


3

Add your Content Editor WebPart Set Chrome to None Add HTML like this: <div class="ms-comm-adminLinks ms-core-defaultFont ms-noList"> <div class="ms-webpart-titleText"> My Web Part </div> <ul class="ms-comm-adminLinksList"> <li class="ms-comm-adminLinksListItem"> <a class="ms-link" ...


3

If you don't want to modify the master page, then the alternative is to go into Site Settings and click on Master Page in the look and feel section and in there add your custom css file into the Alternate CSS URL section.


3

In SharePoint, the main viewport of the webpage is not the html or body elements. Instead, they use div#s4-workspace, which is meant to take up 100% of the height and width (minus the ribbon). Try adding your overflow-y to this element: #s4-workspace { overflow-y: scroll; }


3

In order to overcome the tedium that ensues at the onset of every SharePoint 2010 design project, I have created a simple snippet of CSS that is intended to reset the SharePoint interface styles to inherit from your default document styles. Take a look at the SharePoint 2010 CSS Reset from Kyle Schaeffer. I didn't test it yet, but it seems to do exactly ...


3

It's possible to use plain link tag in your master page header if you can't use <SharePoint:CSSRegistration ... />, as in the case where you want to use the media attribute. <link type="text/css" rel="stylesheet" media="only screen and (min-width: 1024px)" href="Style/default.css" /> <link type="text/css" rel="stylesheet" media="only screen ...


3

try changing it to div#suiteBarLeft{ background-color: red !important; }


3

Since it is CSS attributes, the server will not send any of the pictures until the browser parses the CSS and request one of the images based on how it interprets the CSS. Too me, I do not see why this shouldn't work. Just give it a try and then use fiddler or similar to se which requests and responses are sent between the browser and the server. To ...


3

Many of the class/id names have changed. Some slightly, some significantly and some are still the same. Off the top of head and from briefly flipping through my notes a few (related to quick-launch and navigation): /*2010 quick launch or current navigation*/ #ms-quickLaunch { your styles } /*2013 quick launch or current navigation*/ #sideNavBox { your ...


3

To hide it during Print, you can use the following CSS: @media print { div#suiteBar { display: none; } }


3

try <SharePoint:CSSRegistration ID="CSSReg5" name="<%$SPUrl:~SiteCollection/Style Library/CSS/styles.css%>" After="corev4.css" runat="server"/> the part <%$SPUrl:~SiteCollection points to the root site collection, maybe your code is not pointing to that location! rather the site or sub site, method above explicitly says root site collection ...


2

< SharePoint:ScriptLink language=”javascript” Defer=”true” runat=”server” Localizable=”true” Name=”code.js” /> That should do the trick within the masterpage! the custom javascript file Name=”code.js” would be located at: C:\Program Files\Common files\Microsoft Shared\Web Server Extensions\15\Template\layouts\1033 to put it in a custom folder ...


2

there's a way of getting JS included in all pages using Custom Actions, should work with SharePoint 2013 as well: Edit: Sorry, here's the actual how-to on using CustomActions to reference JavaScript files: How to add custom JavaScript code to all SharePoint 2010 pages (CustomAction) but just in case, ScriptLink registration in SharePoint 2013 sandbox ...


2

John, Try #SearchBox { background-color: white; }


2

Try using !important after your rule to override the inline style: #s4-titlerow{ display: none !important; }


2

You can add the layouts mapped folder to your project and keep javascript and css files there.You can then use ScriptLink class to register the js and CssRegistration class to register the css in the Page_Load method of the webpart. Following is the example: private const string script = "/_layouts/JQuery/JS/jquery.min.js"; ScriptLink.Register(Page, script ...


2

Please concentrate on the following css classes: .ms-welcome-hover .ms-siteaction-hover and adjust the background colors: for the font color adjust this here:


2

This thread might provide some clarity. Masterpage and CSS are not applied in IE 8 If IE8 is indeed loading CSS in a different order than more modern browsers, you might have to be more specific in your CSS as outlined in the thread.


2

Don't use Css in this case. Use JQuery instead because you have inheritance of styles and you can hide other things. put the following code in a script javascript tag $("#ID_AboutMe").closest("li").hide(); I assume that you have jquery library referenced



Only top voted, non community-wiki answers of a minimum length are eligible