I have problem with an order in which I am loading
<script type="text/javascript" src="/_layouts/15/sp.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.runtime.js"></script>
on my page
This is the whole head section on my master page.
<head runat="server">
<meta name="GENERATOR" content="Microsoft SharePoint" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=10"/>
<meta http-equiv="Expires" content="0" />
<SharePoint:SPPinnedSiteTile runat="server" TileUrl="/_layouts/15/images/SharePointMetroAppTile.png" TileColor="#0072C6" />
<SharePoint:RobotsMetaTag runat="server"/>
<SharePoint:PageTitle runat="server">
<asp:ContentPlaceHolder id="PlaceHolderPageTitle" runat="server">
<SharePoint:ProjectProperty Property="Title" runat="server" />
</asp:ContentPlaceHolder>
</SharePoint:PageTitle>
<SharePoint:SPShortcutIcon runat="server" IconUrl="/_layouts/15/images/favicon.ico?rev=23" />
<SharePoint:StartScript runat="server" />
<SharePoint:CssLink runat="server" Version="15"/>
<SharePoint:CacheManifestLink runat="server"/>
<SharePoint:ScriptLink language="javascript" name="core.js" OnDemand="true" runat="server" Localizable="false" />
<SharePoint:ScriptLink language="javascript" name="menu.js" OnDemand="true" runat="server" Localizable="false" />
<SharePoint:ScriptLink language="javascript" name="callout.js" OnDemand="true" runat="server" Localizable="false" />
<SharePoint:ScriptLink language="javascript" name="sharing.js" OnDemand="true" runat="server" Localizable="false" />
<SharePoint:ScriptLink language="javascript" name="suitelinks.js" OnDemand="true" runat="server" Localizable="false" />
<SharePoint:CustomJSUrl runat="server" />
<SharePoint:SoapDiscoveryLink runat="server" />
<SharePoint:AjaxDelta id="DeltaPlaceHolderAdditionalPageHead" Container="false" runat="server">
<asp:ContentPlaceHolder id="PlaceHolderAdditionalPageHead" runat="server" />
<SharePoint:DelegateControl runat="server" ControlId="AdditionalPageHead" AllowMultipleControls="true" />
<asp:ContentPlaceHolder id="PlaceHolderBodyAreaClass" runat="server" />
</SharePoint:AjaxDelta>
<SharePoint:CssRegistration Name="Themable/corev15.css" runat="server" />
<script type="text/javascript" src="/_layouts/15/sp.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.runtime.js"></script>
<SharePoint:ScriptLink ID="ScriptLink1" runat="server" Name="~sitecollection/_catalogs/masterpage/Resources/js/jquery-1.11.0.min.js" Language="javascript" />
<SharePoint:ScriptLink ID="ScriptLink3" runat="server" Name="~sitecollection/_catalogs/masterpage/Resources/js/global.js" Language="javascript" />
<link rel="stylesheet" type="text/css" href="Resources/css/quack_1200.css" />
<link rel="stylesheet" type="text/css" href="Resources/css/main.css" />
</head>
Following order breaks my code like this (when I am trying to work with sp context):
<script type="text/javascript" src="/_layouts/15/sp.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.runtime.js"></script>
However if I switch the order of the scripts like this I don't get the previous error but I get following error if I try to go to a list and click on an "Edit" button.
<script type="text/javascript" src="/_layouts/15/sp.runtime.js"></script>
<script type="text/javascript" src="/_layouts/15/sp.js"></script>
Any help on this confusing issue would be very much appreciated.
Use script tags as:
<Sharepoint:ScriptLink runat="server" Name="SP.js" Localizable="false" ID="s1" LoadAfterUI="true"/>
<Sharepoint:ScriptLink runat="server" Name="SP.Runtime.js" Localizable="false" ID="s2" LoadAfterUI="true"/>
It might solve your problem.
Related
I am developing a codeigniter4 web-application. I use apache as my web server. When I enable CSP in app/Config/App.php using
public $CSPEnabled = true; , I get the image in my web page blocked. How would I unblock images from same origin and disable others by customizing CSP behaviour?.
The head tag of my code is:
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="apple-touch-icon" sizes="76x76" href="../assets/img/apple-icon.png" />
<link rel="icon" type="image/png" href="../assets/img/favicon.png" />
<title><?=$title?></title>
<!-- Fonts and icons -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700" rel="stylesheet" />
<!-- Font Awesome Icons -->
<script src="https://kit.fontawesome.com/42d5adcbca.js" crossorigin="anonymous"></script>
<!-- Nucleo Icons -->
<link href="../assets/css/nucleo-icons.css" rel="stylesheet" />
<link href="../assets/css/nucleo-svg.css" rel="stylesheet" />
<script src="https://cdn.tailwindcss.com"></script>
<!-- Main Styling -->
<link href="../assets/css/soft-ui-dashboard-tailwind.css?v=1.0.4" rel="stylesheet" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.0/jquery.validate.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.0/additional-methods.min.js"></script>
<style>
.errors {font-size:small;color:red;}
.error {font-size:small;color:red;}
.alert {font-size:small;color:red;}
</style>
</head>
The portion of the page that contains the image which gets blocked after enabling csp is:
<div class="w-full max-w-full px-3 lg:flex-0 shrink-0 md:w-6/12">
<div class="absolute top-0 hidden w-3/5 h-full -mr-32 overflow-hidden -skew-x-10 -right-40 rounded-bl-xl md:block">
<div class="absolute inset-x-0 top-0 z-0 h-full -ml-16 bg-cover skew-x-10" style="background-image: url('../assets/img/curved-images/curved6.jpg')"></div>
</div>
</div>
</div>
My ContentSecurityPolicy.php file has the following settings:
public $reportOnly = true;
public $styleSrc = ['self','https://fonts.googleapis.com/css','https://cdn.tailwindcss.com'];
public $imageSrc = ['self', 'https://cdn.tailwindcss.com'];
Some of the stylings also doesnt work after enabling CSP.
You will have to whitelist the domain from which you load the image in your website at, app\Config\ContentSecurityPolicy.php.
The line to be modified is, public $imageSrc = 'self';
self - You can load images from the same domain as your website.
Example:
public $imageSrc = ['self', 'data: w3.org/svg/2000', 'https://www.google.com'];
With this you can load images from your same domain, google.com and inline SVG images which is usually used in Twitter bootstrap.
I have set up my site with an off canvas menu when it goes mobile
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title> Mobile Application</title>
<link rel="stylesheet" href="css/normalize.css" />
<link rel="stylesheet" href="css/foundation.css" />
<link rel="stylesheet" href="css/custom.css" />
<link rel="stylesheet" href="css/custom-mobile-portrait.css" />
<link rel="stylesheet" href="css/custom-mobile-landscape.css" />
<link rel="stylesheet" href="css/custom-xlarge.css" />
<link rel="stylesheet" href="css/custom-ipad.css" />
<link rel="stylesheet" href="css/custom-ipad-portrait.css" />
<link rel="stylesheet" href="css/font-sizes.css" />
<link href='http://fonts.googleapis.com/css?family=Muli' rel='stylesheet' type='text/css'>
<script src="js/vendor/modernizr.js"></script>
<a name="head"></a>
</head>
<body>
<div class="off-canvas-wrap mobile-menu" data-offcanvas>
<div class="inner-wrap">
<nav class=" tab-bar hidden-for-large-up" data-topbar ">
<section class="left-small ">
<a class="left-off-canvas-toggle menu-icon " href="# "><span></span></a>
</section>
<section class="middle tab-bar-section ">
</section>
</nav>
<aside class="left-off-canvas-menu ">
<ul class="off-canvas-list ">
<li><label>Dehumaniser App</label></li>
<li><STRONG>TOP</STRONG></li>
<li><STRONG>APP OVERVIEW</STRONG></li>
<li><STRONG>HOW DOES IT WORK</STRONG></li>
<li><a href="#features " ><STRONG>FEATURES</STRONG></a></li>
<li><STRONG>GALLERY</STRONG></li>
</ul>
</aside>
<!-- <aside class="right-off-canvas-menu ">
<ul class="off-canvas-list ">
<li><label>Users</label></li>
<li>Hari Seldon</li>
<li>...</li>
</ul>
</aside> -->
<section class="main-section ">
i put my site content in here and then after my code finishes:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script src="js/vendor/fastclick.js"></script>
<script src="js/foundation.min.js"></script>
<script src="js/foundation/foundation.js"></script>
<script src="js/foundation/foundation.offcanvas.js"></script>
<link rel="stylesheet" type="text/css" href="http://cdn.jsdelivr.net/jquery.slick/1.3.15/slick.css" />
<script type="text/javascript" src="http://cdn.jsdelivr.net/jquery.slick/1.3.15/slick.min.js"></script>
<script src="js/myscript.js"></script>
<script src="js/foundation/foundation.topbar.js"></script>
<script src="js/foundation/foundation.orbit.js"></script>
<script src="js/myscript.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('.single-item').slick();
});
</script>
<script type="text/javascript">
jQuery(document).foundation()
</script>
</section>
<a class="exit-off-canvas"></a>
</div>
</div>
<script>
jQuery(document).foundation();
jQuery('a.left-off-canvas-toggle').on('click', function() {
});
</script>
<div id="fixedbutton">
<a href="#head"><img src="img/upbutton.png">
</a>
</div>
</body>
</html>
I get the proper off canvas behavior (I get the three lines box . when I click the box it opens, and the off-canvas menu appears) but when I click a menu link even though the page scrolls smoothly down the off-canvas menu doesn't close. How can I fix this?
Try to add these lines to your script
$(document).foundation({
offcanvas : {
close_on_click : true
}
});
The default.aspx page created when starting a new SharePoint App is not needing my needs since it inherits from the host web master page and I have found it easier to obtain a responsive design with my own index.aspx page that has less complexity. Using this article JSOM in HTML5 Apps, I am attempting to retrieve the FormDigest, but upon code inspection it is not working. Any ideas? Here is my current code:
<!DOCTYPE html>
<%--Declare the Page Language and obtain the SharePoint namespace required for retrieving the FormDigest header--%>
<%# Page language="C#" %>
<%# Register TagPrefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%# Import Namespace="Microsoft.SharePoint" %>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title></title>
<link href="../Content/bootstrap.min.css" rel="stylesheet" />
<link href="../Content/App.css" rel="stylesheet" />
<script src="../Scripts/jquery-1.9.1.min.js"></script>
<script src="/_layouts/1033/init.js"></script>
<script src="/_layouts/MicrosoftAjax.js"></script>
<script src="/_layouts/sp.core.js"></script>
<script src="/_layouts/15/sp.runtime.js"></script>
<script src="/_layouts/15/sp.js"></script>
<script src="/_layouts/15/SP.RequestExecutor.js"></script>
<script src="/_layouts/15/SP.UI.Controls.js"></script>
<script src="../Scripts/angular.min.js"></script>
<script src="../Scripts/ui-bootstrap-tpls-0.12.0.min.js"></script>
<script src="../Scripts/angular-route.min.js"></script>
<script src="../Scripts/angular-resource.min.js"></script>
<script src="../Scripts/dirPagination.js"></script>
<script src="../Services/services.js"></script>
<script src="../Controllers/controllers.js"></script>
<script src="../App.js"></script>
</head>
<body>
<SharePoint:FormDigest ID="FormDigest1" runat="server"></SharePoint:FormDigest>
<div class="container" data-ng-app="app">
<div id="chrome_ctrl_container"></div>
<div>
<p id="message">
initializing...
</p>
</div>
<div data-ng-view></div>
<hr>
<footer></footer>
</div>
</body>
</html>
I have discovered that I needed a form instance to execute the call. Its working perfectly:
index.aspx
<!DOCTYPE html>
<%--Declare the Page Language and obtain the SharePoint namespace required for retrieving the FormDigest header--%>
<%# Page language="C#" %>
<%# Register TagPrefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%# Import Namespace="Microsoft.SharePoint" %>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title></title>
<link href="../Content/bootstrap.min.css" rel="stylesheet" />
<link href="../Content/App.css" rel="stylesheet" />
<script src="../Scripts/jquery-1.9.1.min.js"></script>
<script src="/_layouts/1033/init.js"></script>
<script src="/_layouts/MicrosoftAjax.js"></script>
<script src="/_layouts/sp.core.js"></script>
<script src="/_layouts/15/sp.runtime.js"></script>
<script src="/_layouts/15/sp.js"></script>
<script src="/_layouts/15/SP.RequestExecutor.js"></script>
<script src="/_layouts/15/SP.UI.Controls.js"></script>
<script src="../Scripts/angular.min.js"></script>
<script src="../Scripts/ui-bootstrap-tpls-0.12.0.min.js"></script>
<script src="../Scripts/angular-route.min.js"></script>
<script src="../Scripts/angular-resource.min.js"></script>
<script src="../Scripts/dirPagination.js"></script>
<script src="../Services/services.js"></script>
<script src="../Controllers/controllers.js"></script>
<script src="../App.js"></script>
</head>
<body>
<%-- Get the form digest to use for POST/Update/Delete operations via Web services--%>
<form id="Form1" method="post" runat="server">
<SharePoint:FormDigest ID="FormDigest1" runat="server"></SharePoint:FormDigest>
</form>
<div class="container" data-ng-app="app">
<div id="chrome_ctrl_container"></div>
<div>
<p id="message">
initializing...
</p>
</div>
<div data-ng-view></div>
<hr>
<footer></footer>
</div>
</body>
</html>
Example of us in ngResource call via AngularJS:
appServices.factory('appTypes', ['$resource', function ($resource) {
return $resource("/_api/web/lists/getbytitle('Todo Types List')/Items", {Id: "#Id"},
{
'query': { method: "GET", isArray: false, headers: { 'Accept': 'application/json;odata=nometadata' } },
'update': { method: 'PATCH', headers: { 'Accept': 'application/json;odata=nometadata' } },
'save': { method: 'POST', headers: { 'Accept': 'application/json;odata=nometadata', 'content-type': 'application/json;odata=nometadata', 'X-RequestDigest': $("#__REQUESTDIGEST").val() } }
}
);
}]);
I have googled for this and I am not an expert on it either. I tried the following code thinking I am doing it right to implement a simple autocomplete textbox. But does not work. Here is the code. If anyone would help out what could be wrong with it, that will be a big help. My textbox simply does not return any autocomplete suggestions when I try it.
Thanks.
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="jquery.WebForm1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<%--<link href="jquery-ui-1.8.13.custom.css" rel="stylesheet" type="text/css" />--%>
<title></title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
rel="stylesheet" type="text/css"/>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.1.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<script type="text/javascript">
$(function () {
$("#TextBox1").autocomplete
({
source: ["Joe", "John", "Jack", "Ben", "Bell", "Steve", "Scott"] // simple list of strings
});
});
</script>
<asp:Button ID="Button1" runat="server" Text="Button" />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<br />
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
</div>
</form>
</body>
</html>
There is no reference for jquery ui library in ur code
TRY TO ADD THIS :
<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.min.js" type="text/javascript"></script>
I'm migrating a beginning project from PrimeFaces 2.2.1 to 3.3.1, following the steps of MigrationGuide and using the 3.3 version's Users Guide.
I want a p:dialog in the top of the pages, containing the navigation.
This dialog must be shown when I click in a link, in the top of the pages.
Error description:
When I click on "I Want" link, nothing happens on page (the p:dialog doesn't shows up), and I get
this error on Firebug's console:
popupModalMenu is not defined
http://localhost:8080/{appname}/view/xhtml/principal.jsf
Line 1
The p:dialog (id="modalMenu") is loaded on page.
Here goes the structure:
Main page (/view/xhtml/principal.xhtml):
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<ui:composition template="base/master.xhtml">
<ui:define name="conteudo">
Title of Main Page
</ui:define>
</ui:composition>
</html>
Master (/view/xhtml/base/master.xhtml):
<html><!-- DOCTYPE GOES HERE -->
<ui:include src="head.xhtml" /> <!-- CONTAINS CSS, JAVASCRIPT STUFF -->
<h:body>
<f:view contentType="text/html" >
<div id="wrapper">
<!-- TOP BEGIN -->
<div id="header">
<div class="topo" id="topo">
<div id="menuTopo" class="menu left">
<a id="linkMenu" class="left" href="javascript:;" onclick="popupModalMenu.show();">
I want
<div class="iconeDoMenu"></div>
</a>
</div>
</div>
</div>
<!-- END TOP -->
<!-- CONTENT BEGIN -->
<div id="content">
<div id="conteudo">
<!-- SYSTEM MENU BEGIN -->
<ui:include src="../menu.xhtml" />
<!-- END SYSTEM MENU -->
</div>
</div>
<!-- END CONTENT -->
</div>
</f:view>
</h:body>
</html>
Head (/view/xhtml/base/head.xhtml):
<html><!-- DOCTYPE GOES HERE -->
<h:head>
<title>Title</title>
<meta http-equiv="keywords" content=" " />
<meta http-equiv="description" content=" " />
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<link rel="stylesheet" type="text/css" href="../css/base/reset.css" />
<link rel="stylesheet" type="text/css" href="../css/base/general.css" />
<link rel="stylesheet" type="text/css" href="../css/base/skin.css" />
<link rel="stylesheet" type="text/css" href="../css/primefaces/primefaces.css"/>
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="../css/base/generalIE7.css" />
<![endif]-->
<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="../css/base/generalIE8.css" />
<![endif]-->
<script type="text/javascript">
jQuery.noConflict();
</script>
<script language="javascript" type="text/javascript" src="#{facesContext.externalContext.request.contextPath}/view/js/currency_mask.js"></script>
<script language="javascript" type="text/javascript" src="#{facesContext.externalContext.request.contextPath}/view/js/date_mask.js"></script>
<script type="text/javascript" src="../js/ourjs.js"></script>
<!-- Internal screen's Css -->
<link href="../css/generalUtilScreen.css" media="all" rel="stylesheet" type="text/css"/>
<!-- menu's scripts and css -->
<link href="../css/base/menu.css" media="all" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="../js/jquery.metadata.js"></script>
<script type="text/javascript" src="../js/jquery.mb.flipText.js"></script>
<script type="text/javascript" src="../js/mbExtruder.js"></script>
<script type="text/javascript">
$(function(){
$("#extruderLeft").buildMbExtruder({
position:"left",
width:300,
extruderOpacity:.8,
hidePanelsOnClose:true,
accordionPanels:true,
onExtOpen:function(){},
onExtContentLoad:function(){},
onExtClose:function(){}
});
});
</script><!-- menu's scripts and css end -->
<!-- Scripts inside menu -->
<h:outputStylesheet library="primefaces/jquery/ui" name="jquery-ui.css"/>
<h:outputScript library="primefaces/jquery/ui" name="jquery-ui.js" target="head"/>
<script type="text/javascript">
$(function(){
// Accordion
$("#accordion").accordion({ header: "h3" });
});
</script><!-- end Scripts inside menu -->
<script type="text/javascript" src="../js/verticaltabs.pack.js"></script> <!--http://dean.edwards.name/packer/-->
<link rel="stylesheet" href="../css/base/verticaltabs.css" />
<script type="text/javascript" src="../js/provider.js"></script>
<script type="text/javascript">
$(document).ready(function(){fornecedor.verticalTabs();});
</script>
<!-- Internal screen's Css -->
<link href="../css/provider.css" rel="stylesheet" type="text/css"></link>
<!-- END PROVIDER -->
</h:head>
</html>
Menu (/view/xhtml/menu.xhtml):
<html><!-- DOCTYPE GOES HERE -->
<p:dialog id="modalMenu" widgetVar="popupModalMenu"
draggable="false" resizable="false" modal="true"
width="940" height="580"
showEffect="fade" hideEffect ="fade"
position="null" closable="false" dynamic="false"
minimizable="false" maximizable="false">
<h:form id="formMenu">
<div id="nav">
<div id="menu">
<p:commandButton id="btnCloseModalMenu" styleClass="btcloseMenu"
title="Click here to close" onclick="popupModalMenu.hide();">
</p:commandButton>
<!-- Menu's content goes this way: -->
<div id="divN">
<!-- Group of content -->
<h3><h:outputLabel>Group N</h:outputLabel></h3>
<div class="linkN">
<!-- Links to pages -->
<ul>
<li><a id="menuN" href="urlN">Title N</a></li>
</ul>
</div>
</div>
</div>
</div>
</h:form>
</p:dialog>
</html>
I just removed some code from Head. Seems that it is a conflict with JQuery's version. Thanks to a coworker.
So the code went like this:
Head (/view/xhtml/base/head.xhtml):
<html><!-- DOCTYPE GOES HERE -->
<h:head>
<title>Title</title>
<meta http-equiv="keywords" content=" " />
<meta http-equiv="description" content=" " />
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<link rel="stylesheet" type="text/css" href="../css/base/reset.css" />
<link rel="stylesheet" type="text/css" href="../css/base/general.css" />
<link rel="stylesheet" type="text/css" href="../css/base/skin.css" />
<link rel="stylesheet" type="text/css" href="../css/primefaces/primefaces.css"/>
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="../css/base/generalIE7.css" />
<![endif]-->
<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="../css/base/generalIE8.css" />
<![endif]-->
<!-- REMOVED
<script type="text/javascript">
jQuery.noConflict();
</script>
-->
<script language="javascript" type="text/javascript" src="#{facesContext.externalContext.request.contextPath}/view/js/currency_mask.js"></script>
<script language="javascript" type="text/javascript" src="#{facesContext.externalContext.request.contextPath}/view/js/date_mask.js"></script>
<script type="text/javascript" src="../js/ourjs.js"></script>
<!-- Internal screen's Css -->
<link href="../css/generalUtilScreen.css" media="all" rel="stylesheet" type="text/css"/>
<!-- menu's scripts and css -->
<link href="../css/base/menu.css" media="all" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="../js/jquery.metadata.js"></script>
<script type="text/javascript" src="../js/jquery.mb.flipText.js"></script>
<script type="text/javascript" src="../js/mbExtruder.js"></script>
<script type="text/javascript">
$(function(){
$("#extruderLeft").buildMbExtruder({
position:"left",
width:300,
extruderOpacity:.8,
hidePanelsOnClose:true,
accordionPanels:true,
onExtOpen:function(){},
onExtContentLoad:function(){},
onExtClose:function(){}
});
});
</script><!-- menu's scripts and css end -->
<!-- Scripts inside menu -->
<h:outputStylesheet library="primefaces/jquery/ui" name="jquery-ui.css"/>
<h:outputScript library="primefaces/jquery/ui" name="jquery-ui.js" target="head"/>
<script type="text/javascript">
$(function(){
// Accordion
$("#accordion").accordion({ header: "h3" });
});
</script><!-- end Scripts inside menu -->
<script type="text/javascript" src="../js/verticaltabs.pack.js"></script> <!--http://dean.edwards.name/packer/-->
<link rel="stylesheet" href="../css/base/verticaltabs.css" />
<script type="text/javascript" src="../js/provider.js"></script>
<script type="text/javascript">
$(document).ready(function(){fornecedor.verticalTabs();});
</script>
<!-- Internal screen's Css -->
<link href="../css/provider.css" rel="stylesheet" type="text/css"></link>
<!-- END PROVIDER -->
</h:head>
</html>
Place <h:head/> in head.xhtml
You are missing a </div> tag after <!-- END SYSTEM MENU --> in the master.xhtml file