I have a homepage on an Intranet. It has at 15+ webparts (news, weather, etc.) I want to allow the users to customize the page by moving the webparts around or deleting them. At present I don't let them see the ribbon at the top so they don't have access to the "Edit page" button. I have pulled it out from the Ribbon
<a unselectable="on" href="javascript:;" onclick="return false;" class="ms-cui-ctl-large" aria-describedby="Ribbon.WebPartPage.Edit.Edit.Menu.Actions.Edit_ToolTip" mscui:controltype="Button" role="button" style="height: auto;" id="Ribbon.WebPartPage.Edit.Edit-SelectedItem">
<span unselectable="on" class="ms-cui-ctl-largeIconContainer">
<span unselectable="on" class=" ms-cui-img-32by32 ms-cui-img-cont-float">
<img unselectable="on" alt="" src="/_layouts/1033/images/formatmap32x32.png" style="top: -160px; left: -96px;">
</span>
</span>
<span unselectable="on" class="ms-cui-ctl-largelabel" style="height: auto;">Edit<span unselectable="on">
</span>Page</span>
</a>
Unfortunately it is not working. Any thoughts?
I will be doing the same with the "Stop Editing" button as well.
According to this post: http://artykul8.com/2011/03/useful-sharepoint-shortcuts/
the trick is to use the MSOLayout_ToggleLayoutMode(); javascript function.
According to a comment in that same page, in SP2010, that javascript function is only available when you already have a web part in the page. The behavior I observed differs from this one, given that, to me, this function only worked when the page was in edit mode already (and it worked even when the page had no web part added).
I was able to find the javascript file where that function is defined, which is the ie55up.js. You can load it in your masterpage by doing:
<SharePoint:ScriptLink language="javascript" name="ie55up.js" OnDemand="false" runat="server" />
For information about how to build a web control that uses that javascript function, see here: http://www.codeproject.com/KB/sharepoint/SwitchWPMode.aspx
Hope this helps
I finally found the answer to this question. It was very simple after the JS call was determined. I believe this should be for a webpart only page.
To put the page in edit mode for Personalization via a Javascript call:
ChangeLayoutMode(true); // how simple is that??
To stop the editing of the page via a Javascript call:
MSOLayout_ToggleLayoutMode(); // same as given in the other post
The "Stop" edit mode I believe is the same for all pages no matter if it's a personalized page, all webparts page, etc.
Related
I asked this question in a Wordpress forum with no response. So trying here in hope of an answer or suggestion.
I'm using the Wordpress Twenty Seventeen theme (here) and the multi-panel homepage. My menu is a series of "custom links" which navigate to anchors in each of the homepage panel sections.
The navigation to the anchors is not consistent. Some land where they are supposed to, and others land after the intended location. When I inspect the page code, the only difference in the panel sections is where 'tabindex' gets set.
The ones that work show tabindex set at ‘panel-content’ level:
<div class="panel-content" id="noted" tabindex="-1">
<div class="wrap">
<div class="entry-content">
<p><a name="noted"></a> </p>
<h2>Noted</h2>
The ones that land incorrectly have tabindex set in the “a” anchor link.
<div class="panel-content" id="video">
<div class="wrap">
<div class="entry-content">
<p><a name="video" tabindex="-1"></a></p>
<h2>A Video is Worth a Thousand Words</h2>`
It seems random from panel section to panel section. I didn't do anything differently when creating the page. I have never dealt with tabindex before.
Any suggestion on how to correct this, so the anchors land where intended?
Thanks in advance, Mike
This issue is resolved. Turned out to be a Wordpress plugin issue.
https://wordpress.org/support/topic/tabindex-for-home-homepage-panels/#post-10781852
I would like to change the call to action button on the landing page of my website to a social icons element. How do I edit the HTML code to do this? I am using the "Paris - Business" theme. Thanks.
There is some documentation on how to do this, if you search the web. For example, my own site has a basic example of what to look for Landing Page Button Removal.
In that case, you could replace the code that makes the button with your own code.
That being said, there's some new features you can use that would make the content editable. Weebly just introduced "Sections". Sections allows you to have different sections on a page, and with that you can also drag and drop into the Header area. (See Screenshot)
*BUT, before you go ahead and do this, I should note that Weebly plans on making these changes to the newer themes, in the near future. When Paris would be done, or if it will be done, is anybody's guess.
Depending on the design of your Theme, this might be slightly different, so please keep that in mind.
Basically, for the Paris Theme, what was:
<div class="banner-wrap wsite-background">
<div class="container">
<div class="banner">
<h2>{headline:text global="false"}</h2>
<p>{headline-paragraph:text global="false"}</p>
<div class="button-wrap">{action:button global="false"}</div>
<span id="contentArrow"><span></span></span>
</div>
</div>
</div>
Would become:
<div class="banner-wrap wsite-background">
<div class="container">
{{#header}}
<div class="banner">
{content}
<span id="contentArrow"><span></span></span>
</div>
{{/header}}
</div>
</div>
*If you are customizing a Theme, I might also recommend making a custom page type, specifically with these changes.
If you want to use Sections, for the content area of the page it would look something like:
<div class="main-wrap">
{{#sections}}
<div class="container">{content}</div>
{{/sections}}
</div>
**Note: There isn't any documentation yet, and I have not tested this, so wsite-background may not be needed... but don't take my word for it.
We have a mindbreeze Installation, which defines 3 Datasources. And with the editor I created a searchmask.
The generated/exported code seems to be plain Mustache-html,
<div data-template="filteredfacet" data-name="datasource/category" role="treeitem" tabindex="-1" aria-expanded="true" aria-labelledby="label7841" style="position: relative;">
<script type="text/x-mustache-template" data-tag-name="span" data-attr-title="{{name}}{{^name?}}{{html}}{{/name?}}">
<span class="{{#showAddAnd?}}mb-add-and-available{{/showAddAnd?}}">
{{{html}}}
{{#showAddAnd?}} <a class="action mb-add-and"><i class="icon-plus-sign"></i></a> {{/showAddAnd?}}
</span>
<span class="pull-right" title="{{count}}">
{{#count?}}{{count}}{{/count?}}{{#excluded}}–{{/excluded}}
</span>
</script>
</div>
Where it only seems possible to change the look and feel.
In the Online Documentation an Cheat-Sheet I could find some metadata, but not the desired.
Does someone have any experience with this? Or some pointer how I can limit a search on only on specific data source.
You can add a constraint for the whole search application. This also allows you to restrict to a specific data source. Just add a results display like "List", "Image Gallery" or "Map":
After adding you can change the option "Restrict the Results" to every query you want. In your case e.g. datasource/category:"Web" does the trick.
Background
I have a basic HTML page with an iframe that points to a page with a SilverLight object on it. When the Silverlight object extends past the predefined height, the vertical scroll bar is displayed but in an inactive state. Below is my HTML and screen shots of the iframe.
Question
Is it possible to have a vertical scroll bar in an iframe when the target page contains a Silverlight object?
Code
<html>
<body>
<form>
<div>
<IFRAME height="300" width="1000" name="MyFrame" scrolling="yes"
src="http://mycompany.com/mysilverlightpage.aspx">
</IFRAME>
</div>
</form>
</body>
</html>
Screen Shots
This issue had nothing to do with Silverlight but with the SharePoint masterpage hosting the web part that hosted the Silverlight object. To allow the vertical scroll in this case the following changes need to be made to the masterpage. I created a custom masterpage based off for my business needs so I didn't have to worry about these mods wrecking the rest of my environment.
Remove scroll="no" from the body tag
Remove the two divs surrounding the "PlaceHolderMain" ContentPlaceHolder
<div ID="s4-workspace" class="s4-nosetwidth">
<div ID="s4-bodyContainer">
<asp:ContentPlaceHolder id="PlaceHolderMain" runat="server"/>
</div>
</div>
I am using this code:
<div class="infobox-pair">
<div class="ibp-left">
<iframe width="105" height="350" frameborder="0" scrolling="no" style="width: 311px; height: 105px;" marginwidth="0" marginheight="0" name="infobox_flight" id="ibp-left-iframe" src="http://mywebpage.com/paris"></iframe>
</div>
<div class="ibp-right">
<iframe width="105" height="350" frameborder="0" scrolling="no" style="width: 311px; height: 105px;" marginwidth="0" marginheight="0" name="infobox_package" id="ibp-right-iframe" src="http://mywebpage.com/lisbonne"></iframe>
</div>
That is displaying into the same div two different iframes. When I display the page whatever the browser it happens that I can get the same content for both the iframes even if looking at the source code the iframe are still different (based on their src and id).
It doesn't happen 100% of the time, I have to refresh sometimes several times to see it.
Do you have any clue ?
Thanks in advance
One thing to keep in mind, when you refresh in IE and some other browsers, the browser will retain the "current" src="" value for iframe, so if you navigated around a bit in the iframes, then hit F5, the current last navigated path for each iframe is still in the iframes. Is it possible you navigated to the same page somehow?
The only reliable way to get the iframes to "Reset" back to their initial src values on a refresh(f5) is to use javascript to set their src as a part of the page load event. I recommend setting the initial src in markup to just "about:blank" and alwyas programatically change it.
This has been a long time answered but have some additional info that might help web developers.
If you have loaded iFrame 1 in the browser before, then the newly added iFrame 2 will show the same content, even after refreshing multiple times. Try hitting Ctrl + F5, or clearing your temp files in browser, this can reset the iFrame src to it's correct value.