SharePoint Den: HTML

Showing posts with label HTML. Show all posts

16 Nov 2017

SPPP Presentation

Sppp presentation from Denis Molodtsov

17 Mar 2015

Hide SharePoint 2013 Controls on Full Screen Mode

How do I hide or Show custom controls in full scree mode?

When you click on "full screen mode" button ms-fullscreenmode class is added to the <Body> tag:

Solution:

A sample snippet of CSS that will hide your controls in full screen

/*hide controlID div only when full screen mode is enabled/

.ms-fullscreenmode #controlID {

display:none;

}

#controlID - id of an HTML element that should be hidden when "full screen" is clicked

13 Dec 2013

Change "SharePoint" in ms-core-brandingtext

In case you were wondering how to change "SharePoint" text in the top left corner:

In SharePoint Management PowerShell:

$app = get-spwebApplication "http://mysite"
$app.SuiteBarBrandingElementHtml = "<div class='ms-core-brandingText'>Custom Brand</div>"
$app.Update()

Done!

25 Jun 2013

Enabling HTML5 on SharePoint 2010 Master Page

This is the original article.

The steps are:

Open your custom Master Page replace the existing DOCTYPE tag with the following HTML5 doctype: <!DOCTYPE html>
Now look for the meta tag, X-UA-Compatible, found in the head section. It should look like: <meta http-equiv="X-UA-Compatible" content="IE=8" />
Update the “content” value to "IE=Edge"

That's it! now you can use lots of CSS 3.0 and HTML5 features.

23 Jun 2013

Replacing InfoPath Forms in SharePoint – Do It Yourself! (Repost)

Here is a very nice article by Bjørn Furuknap on replacing InfoPath forms with HTML and JavaScript

\
You can start watching from 12th minute. It's where valuable stuff begins.

19 Jun 2013

Using SVG Images with Modernizr.js

If you need to add an SVG to your HTML page here what you should do:

Install Inkscape (it's free to use).
Create SVG file
Export to PNG. This file will be used as a fallback in older browsers like IE 7 and IE 8

Create HML page and add .svg Image on it. Problem: IE8 does not support SVG. That's why you need modernizr.js
Include modernizr.js to the page. This will add "svg" or "no-svg" classes to the <HTML> tag.
Now you can use ".no-svg" and ".svg" classes in you CSS selectors to provide fallback to PNG images. In other words, you need to load .png images only when no-svg class exists in DOM.

Final HTML and CSS should be like following:

Total Pageviews