Category Archives: HTML

Anchor tags not working in firefox

Here is the simple issue fixed when working with HTML. This is kind of a browser compatibility issue.

In my SharePoint page we have created a CEWP and placed some HTML code along with anchor tag bookmarks features.

But Book marks is working fine in I-Explorer and not working in Firefox.

This got fixed by removing the “#” from the name of the Div tag name of the Bookmark.

How W3C link checker Works

W3C link checker is a highly recommended link checker. It checks the website and its component such as hypertext links for both HTML and XHTML format; if it is working properly. It is important that a website contains high technical quality. W3C link checker will generate the following reports:

CSS style sheet and extracts a list of anchors and links
It checks that no anchor is defined twice.
All the links are dereferenceable
Warns about HTTP redirects

You can check your URL at W3C Link Checker and you will have to check through this form.

Image

When it is in summary mode, it may take time for loading process. When the checking is done, it will show you “List of broken links and redirects” if broken links were found. You have to go through the pages, fix the broken link or if unresolvable it would be better to delete it. However, the link checker considers robots exclusion rules. When the robots.txt files of the website disallow link checks, there will be no single information from the website that will be seen.

Also view “Markup Validation Service” This validator checks the markup validity of Web documents in HTML, XHTML, SMIL, MathML, etc.

Ref : W3C link checker in SEO

Sharepoint 2010 Fixed width Master Page Styling, no scrollbar issues

Recently I have created a custom master page for our new SharePoint server, First I have noticed that when the page loads, SharePoint  runs a java script function and sets the width of the page.

It is searching for the div tag  with Id  #s4-workspace  and if it finds one with this id, sets its width to fit the content. So I have added a class  s4-nosetwidth. If we add this class to s4-workspace,SharePoint wont set its width.

But very first time when I tried to create fixed width master page, I have faced so many issues with scroll bars and SharePoint modal dialog windows are not opening correctly. They are opening either with in  small height  and added scroll bars or  opening in fixed width and height with out scroll bars.

Mainly IE7 adding its own scroll bar to body  , as the page is fixed width so the scroll bar that is showing in the middle of the page is looking pretty ugly. I have fixed all these issues and below is the styling.

html{
background-color:#55A0A7;
overflow/**/:auto;
}

body.v4master {
width:1024px;
margin:0px auto;
overflow:visible;
background-color: transparent !important;
}

.ms-dialog body.v4master {
height: 100%;
overflow: hidden;
width: 100%;
}
body #s4-workspace {
left: 0;
overflow: auto !important;
overflow/**/: visible !important;
position: relative;
width: 100% !important;
display:table;
border-spacing:0px;
}

.ms-dialog body #s4-workspace{
display:block !important;
overflow/**/: auto !important;
}

Custom Sharepoint 2010 Ribbon Markup Styles

If you’re doing any sort of custom theming for Sharepoint 2010, and have been wondering how to modify the out-of-the-box styles provided by the “Markup Styles” button in the ribbon, take a look at the following:

H1.ms-rteElement-H1B
{
-ms-name:”Colored Heading 1″;
/* [ReplaceColor(themeColor:”Accent1″)] */ color:#0072bc;
font-size:2em;
font-weight:normal;
}

If you Firebug / View Source HTML’d the content, you would probably have worked out how it kind of worked – basically, you just need to overwrite a few css classes to replace the existing ones and add new css classes in the following format:

Note the proprietary -ms-name property, and the use of the ReplaceColor goodness to integrate SP2010 themes into the stylesheet.

Unfortunately though, it looks like the only way to get rid of the out-of-the-box options is to remove the v4.css import (<sharepoint:CssLink runat=”server” Version=”4″ >) from the master page, and make a custom copy that excludes the styles.

Note : an alternative to replacing the v4.css if you’re only interested in modifying one or two of your Publishing HTML controls, you can specify the PrefixStyleSheet property which will replace the default set with the css style sheet you specify.

Reference : Managing the Rich Text Editor CSS and the RTE Menus for the Wiki Pages of a SharePoint 2010 Team Site

Opening HTML Files in SharePoint 2010

I recently faced an issue where the user was attempting to open HTML documents from a document library. He only had an option to download the document. He wanted the ability to open the HTML document directly within the browser.

By default, SharePoint 2010 is blocking the ability to open HTML documents directly from a document library.

However this can be changed by adjusting the browser file handling option. The option is located here:

1. Central Admin\Application Management\Manage Web Applications.

2. Select General Settings for the specified web application

3. For Browser file handling, select permissive. The default is strict.