I want to add a common footer for all my html pages, but the footer has links to different pages in different folders, how can I do this?
The problem is, I can write the footer with respect to one page, where the links point to, but what about other pages?
I want a reusable footer with access to all the correct folder locations in each page I call the footer in.
I tried using a js page for the footer and bringing all the html pages under one main folder, but that isnt the right way to do it.
Any alternate solutions?
The way I usually do this is to create an empty placeholder div for the footer (and header, normally), and use a header-footer.js file to write code into those divs. For large nav structures, I build the nav as a data structure stored in a variable, usually via nested objects, then iterate through that with a function that generates the HTML and places it into the placeholder div.
You can check out my implementation at https://github.com/sdcervi/Reference if you want to see the specifics.
Related
I am working on a website that has around ~20 pages. I also have a nice Navbar at the top that I want to include in every HTML page. I don't want to have to manually paste 30 lines of code in every HTML page just to have a Navbar. Is there a way I can just have a single Navbar HTML page (navbar.html) and include all the lines of code in that single page, and somehow have some HTML or JavaScript code that includes everything in that page at a specific location of my choosing?
If so, I need some direction in incorporating it. This would also be useful for my footer as well.
Thanks in advance!
I have a html document loaded in an iframe on a website.
The document has a table of contents and clicking on any of the links jumps to the appropriate part of the document.
Navigation is supposed to work from a sidebar that is specified by a separate XML.
Adding a link to said XML displays the HTML in the iframe:
href="source_folder/file.html"
Issue is, when I try to add a link to a specific section, like href="source_folder/file.html#_Toc0123" it just jumps back to the top of the HTML.
In the usual use-case, the sections are all separate HTML files, and get linked in the corresponding XML. Issue being I don't want to go through the hassle of separating multiple large files into individual HTMLs.
Any idea on what I'm missing? Or is this simply not possible?
(I didn't build the original site, but if there is an attribute that governs it, feel free to let me know where to look for it)
Thanks!
I have dynamic HTML generated based on user entered content. I want to show that HTML as A4 pages. The content may span to any number of pages as it is continous.
A code pen like this one https://codepen.io/rafaelcastrocouto/pen/LFAes helps how to show html as A4 pages. This is quite good but my problem is that I don't know in advance how much content one page can have. Will the content be rendered in first page tag or two page tags or more, I don't know since this is user generated content.
<page size="A4">
<!-----Dynamic HTML comes here, can confine to this page or overflow out of that---->
</page>
How do I show html structured into multiple pages in this scenario?
I know a hint that it might be possible with use of Javascript or query to create multiple page tags and place html chunks inside that but I would prefer CSS way of doing it as JS mechanism is susceptible to inaccuracies due to calculation of heights.
Is that possible?
Also how about using page-break-before and page-break-after property of CSS. I have used that property but that renders only in PDF, I want to show that in HTML in browser, is that possible with that?
I have a website that I update some of it's content on monthly basis.
The content for those pages include tables in iframe format. Now when I search for that particular keyword i see that google is indexing my iframes individually.
Therefore their contents doesn't add any value to the main parent container.Below you'll see one the pages with iframe.
http://www.reguluspc.com/parts/case.html
I want to keep the content intact but keep the table in iframe and update the table only. To avoid duplicated content, I keep the iframe but it doesn't look good as it doesn't have any navigation or proper CSS file.
Any ideas how to make the iframe content to be indexed as part of the main parent page?
Cheers.
As these are two separate urls, they will be indexed as separate content.
Why are the tables being loaded from iframes? Do you have any server-side languages like PHP, JAVA, .NET, etc? Your might also have *.shtml which would allow you to do server side includes for content like that.
Ok I have been having fun and games trying to sort an issue out with a website.
The home page http://www.haylockpittman.co.uk/ has been replicated to http://www.haylockpittman.co.uk/new-refurb-publish/
BUT, as you can see the images on the sub page do not align correctly like the home page.
I cannot use the home page template on the internal page as we need to change the text at the bottom and as it is set up it the text is widgetised. But we duplicated the template and renamed it.
I have compared the source codes for both pages and apart from titles the only difference is at line 142/143 where the home page calls
<body class="home page page-id-92 page-template page-template-front-page-php singular two-column right-sidebar">
and the internal page calls
<body class="page page-id-2118 page-template page-template-renorefub-php singular two-column right-sidebar">
The problem is I don't want the images on every internal page so I am wary about what I need to change. I assume I need to add a new class or div id and call it. But I am pretty novice at this and the original designer wont help so any advice would be much appreciated.
Thanks in advance.
Home page has CSS rules for '.home #outer #left' but the second doesn't (as it doesn't have the .home class on the body)
Add in extra CSS rules to apply the CSS to the same DIV on the second page.
Use Firebug/Developer Tools etc next time :)