Hello Everyone,
Is it possible to create an HTML5 Top Navigation skin that applies to the entire project and HTML5 Top Navigation no header that would only apply to the startup topic?
Many Thanks,
Jon
Multiple Skins for HTML5 Output
Re: Multiple Skins for HTML5 Output
I'm wondering this, too! Did you ever get a response?
I'm looking to create a landing page that uses a different skin from the rest of the topics -- really just to get rid of the header. So far, applying a different skin in the TOC hasn't worked -- the skin selected for the rest of the project always overrides it.
Please let me know if you solved it -- thanks!
I'm looking to create a landing page that uses a different skin from the rest of the topics -- really just to get rid of the header. So far, applying a different skin in the TOC hasn't worked -- the skin selected for the rest of the project always overrides it.
Please let me know if you solved it -- thanks!
-
- Propellus Maximus
- Posts: 1979
- Joined: Tue Nov 28, 2006 11:18 am
- Location: Crossroads of the West
- Contact:
Re: Multiple Skins for HTML5 Output
Last time I looked at this (and it's been a hot minute) you couldn't change the skin of HTML5 output.
We were pulling up content from the help in a small CSH panel. So I wrote a jquery that would check to see if the cshid attribute was in the URL (because when you make a CSH call, the cshid attribute stayes in the URL on the target page), and if the cshid attribute was present, I used jquery to hide elements I didn't want shown to the end user, and I showed some other elements I DID want shown to the end user.
I haven't needed it for two years, but this is the jquery I wrote. Maybe it can be the start of a solution for you?
We were pulling up content from the help in a small CSH panel. So I wrote a jquery that would check to see if the cshid attribute was in the URL (because when you make a CSH call, the cshid attribute stayes in the URL on the target page), and if the cshid attribute was present, I used jquery to hide elements I didn't want shown to the end user, and I showed some other elements I DID want shown to the end user.
I haven't needed it for two years, but this is the jquery I wrote. Maybe it can be the start of a solution for you?
Code: Select all
$("document").ready(function () {
function getParameterByName(name) {
var url = window.location.href;
name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "));
}
// In this code, we want to check the URL to see if the cshid value is present.
// If it is, we know this topic was called by a CSH call, and for this product
// we want to show the topic without many of the associated elements on the page.
var hideNav = getParameterByName("cshid"); // creates a variable basedon the presence of the cshid parameter in the URL
if(hideNav){ // what to do if the parameter is found in the topic
$("div.sideContent, div.nocontent, div#customSearch, nav.title-bar, div#customFooter, div.cshhide").hide(); // jquery hides these classes and divs
} else { // what to do if the parameter is not found in the topic
$("div.cshonly, div.csholny").hide(); // jquery hides classes intended only for CSH calls.
}
Re: Multiple Skins for HTML5 Output
For your landing page, you could add some extra CSS to hide the header bar.
Although you can build a target with two skins, and display a topic using an alternative skin (by appending ?skinName=YourSkin to the URL), the topic will always default to use the target's main skin - so it's not a permanent fix.
That option you found to select a skin for a TOC entry will not work for HTML5 - that option is apparently for HTML Help (CHM) only.
Code: Select all
nav.title-bar.tab-bar {
display: none;
}
That option you found to select a skin for a TOC entry will not work for HTML5 - that option is apparently for HTML Help (CHM) only.
-
- Propellus Maximus
- Posts: 1979
- Joined: Tue Nov 28, 2006 11:18 am
- Location: Crossroads of the West
- Contact:
Re: Multiple Skins for HTML5 Output
JQuery to the rescue again, I suppose. You could find a specific element on the page or in the URL and then append the skin parameter to the URL.Dave Lee wrote:, the topic will always default to use the target's main skin - so it's not a permanent fix.