Hi,

Looking for resources which will help me to brand the SharePoint public facing website 2013.

Also, let me know what all tools are required for branding , how to add picture slider on home page, customize navigation with drop down menu ?

As i am newbie to the designing concept of SharePoint platform, please guide me on this.

Hi,

You can use a jquery plugin to create your own image slider, you basically need to import the javascrpt files associated with jquery into a HTML page, some thing like below:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"></script>

Then you can use the sliercontainer div class to create a slider of your own with a src reference to an image. You would also need to create a slideselector which would allow you to select between various images slides. Following is an excellent example of how to create an image slider of your own:

http://css-plus.com/2010/09/create-your-own-jquery-image-slider/

If you find this too taxing, time consuming (although its lot of fun) you may use something like menucool, which gives you free slider and menu implementation based on jquery. You just need to download a js files and create a reference to them within your HTML file. There are lot of very interesting menu items as well and they are free.

http://www.menucool.com/javascript-image-slider

• Once you have an HTML file ready, you need to open the SharePoint designer on your server and add this HTML or aspx file to the SitePages or Pages library on your site collection.
• Right click on the file and preview it in browser to see if it looks good to you
• you can even set this file up as the default landing page by marking it as the home page within the designer.
• The menu you create can be linked to various content on your site.
• You can modify the masterpage being referred within your site to remove the side navigation, top ribbon, change background images, theme, fonts, color, Title etc of your site and save the masterpage within the _catalogs/Masterpage folder and set it as the custom masterpage.
• That way the changes made by you will take effect across the entire site.

Do let me know if you have any other queries related to branding that you would like help with.

Vishal

Hi,

Thanks for your reply and providing me various resources.I "ll go through it and let you know if i found any difficulties in achieving the same.

Hi,

I am opting to go with menucool option provided by you. I have downloaded the file from the site  which includes CSS and JScript Script file and with few images.

I wanted to apply this on my SharePoint Online public facing website 2013.Please guide me how do i start with using SharePoint designer.

You need to download an dinstall SharePoint Designer 2013, if you don't already have. You can download it here http://www.microsoft.com/en-in/download/details.aspx?id=35491

• Once installed, open the designer and within Sites -> click on Open Sites menu
• Enter the url of your site collection and open
• Once in, within the Site Objects menu clcik on the All files
• You need to look for a library SitePages or Pages where you have to copy out the aspx page that you have created earlier
• You can alternatively create an aspx page at this location and then add the code to the file
• Once done, save and right click on the file and select Preview in browser to see the file in IE
• If everything is as per your liking then go back to designer and right click on the file and select Set as Home page option
• This will make the file as the default landingpage for your site

If you still find difficulty in configuring the designer then the following site will help you. Its for SP 2010 but the rules remain same for 2013 as well.

http://www.dummies.com/how-to/content/use-sharepoint-designer-with-sharepoint-online.html

Hope this helps, let me know if you have any queries.

Vishal

Hi,

I have downloaded the SharePoint designer 2013.I am trying to edit the master page as mentioned in the steps the link below http://rstagg.com/2013/04/17/office-365-branding-creating-a-custom-masterpage-for-your-office-365-public-facing-website/

But while doing so, i am not able to map network drive, facing some issue , for the same i have attached the screen shot.

My question is:

1) Is it necessary to map network drive to edit master page, can't it be done by using only SharePoint designer?

2)My plan is to edit the existing html page Oslo by making a copy of it through SharePoint designer and add the javascript from the menucool site, so how do i go about it.Please guide me on this.