I am learning to program in HTML. I have multiple pages on my dummy website, all of them with the same sidebar. Now, the sidebar is hard-coded into each file; that means that if a small change has to occur, I have to change every file manually.
I believe this is not the best practice, but is there a better way to do it without using PHP or JavaScript?
Copy your sidebar HTML code to sidebar.php and include it with PHP include or require command:
require("sidebar.php");
Read more at http://php.net/manual/en/function.include.php and http://php.net/manual/en/function.require.php
How about an <iframe> this is the only way I can think of using just HTML
Related
I'm looking for some advice for adding d3.js charts to Wordpress.
My client has commissioned a forceSimulation - still in progress. It is currently organised as follows:
index.html
main_javascript.js
main_css.css
global_properties.js
data_file.csv
I'm totally clueless as to whether it is possible to add the chart to her Wordpress blog and if so how to do it.... Any advice would be much appreciated.
Many thanks.
For reference, here are the WordPress docs on Using JavaScript.
Making it easy for them
From past experience (though not in WordPress), I'd try to simplify the steps your client has to take to get the visualisation working well, just in case the person doing them has little technical skill.
Hence, as far as possible, I'd combine your files into one force-viz.js:
CSS rules can be inlined by using d3.style in JS on the appropriate elements.
CSV can be inlined as a JavaScript string, parsed with d3.csvParse.
global_properties.js can just be in the same JS file.
index.html is unnecessary if you use d3.select(...).append(...) to construct the DOM tree you want, and instruct your client to write—
<div id="force-viz"></div>
—where they want the chart to appear, then d3.select that in your script.
This would mean all your client has to do is:
Place force-viz.js in a scripts/ directory.
Paste—
<div id="force-viz"></div>
<script src="scripts/force-viz.js"></script>
—into the text of any page, wherever they want the chart to appear.
Making it easy for you
If being forced to program into a single file is annoying, I recommend Browserify. It's a tool that can process a set of JavaScript files with require('whatever.js')-calls to each other, combining them appropriately into one file. With a plugin, it can even turn fs.readSync('data.csv') calls into strings containing that file's contents, which you could use with that CSV file.
That way, you could continue programming the thing as separate files, then run browserify to bundle them up for your client.
Or just do it manually, if this is a one-off project. Your call.
I am working on this webpage:http://hypoinvest.sk/ which runs on Wordpress with this theme If you check source code you can see a lot of inline-css and I want to know in which files are actually defined. Only thing what I know about it they are called by function wp_head() in header.php. I have local copy of all files on this web and I can't find any mention about some of that css rules through unix grep. Anyone suspect where these css rules could be located?
check site and let me know.
Run a search in the source code for
style-inline
As this appears to be the 'handle' designated as the first variable in the function wp_add_inline_style. The "-css" is added automatically. You'll see this on line 79 of the page source.
https://codex.wordpress.org/Function_Reference/wp_add_inline_style
You want to check your page back-end site where you put content ,
I think are you using any compose or editor to create page on edit page.
check it edit option it has some inline css.
I am trying to add html to the bottom of all the pages of a drupal 6 site.
I tried following Adding HTML to Drupal closure? but I'm not familiar enough with drupal to follow it.
The code is a google remarketing code, so I can't use drupal_add_js because the code I have already has script tags and , and the drupal_add_js wraps everything in tags.
hook_footer seems to be the best solution but I can't figure out how to use it.
Thanks
The best solution is to use hook_footer().
You have to create a Drupal module. I think this link might help you: https://drupal.org/developing/modules/7
Basically you have to create a module an implementes hook_footer(). In here you can add your custom html.
But there are another ways to do it. For example you can edit your theme. Find the page.tpl.php file in your theme and add, in the footer, the content. It's appears in all pages.
Another option is to create a block with full html filter, and add your html.
Regards.
I ended up putting the html i needed in $vars["closure"]
I am currently working on HTML I want to ask a question about website development.I am developing a website in which the basic layout remains same like menu, side menu etc but only the content changes.Currently I have make separate .html file for all web pages.
Can any one tell me is there a way through which I can make a separate file having etc common to all and call it in my html file.I have heard about CSS but it will only change the style and layout.
thanks
If your HTTP (apache 2 and IIS do) server supports Server Side Includes then you can just include another HTML file :
<!--#include file="header.html"-->
your content
<!--#include file="footer.html"-->
no need for a server side language then - just plain HTML
This is very big topic to include in just one answer. SO I will give only the logical part.
Separate your template into multiple chunks like:
1. header.php
2. leftSidebar.php
4. rightsidebar.php
5. footer.php
Now, include these common part on your every page.
For example: index.php
<?php
include "header.php";
include "leftSidebar.php";
echo "<div>".$thedifferentpart."</div>"; //Change only this part on every other page you will create.
include "footer.php";
?>
NOTE: This is only a logical part, applying the concept on your code
Yes, your best bet is a server side language, as Adam said. Absolutely avoid using the old style html frames: they're deprecated, and cause a certain number of problems, both on the programming side and on google optimization.
By using a server side language, you'll still have entire pages, but they will be partially generated by php (or asp) by printing more files into one. For example:
http://www.php.net/manual/en/function.include.php
Bye!
Your best bet in the long term is to use a server side language like ASP.net or PHP
I don't believe that is possible, strictly through HTML. However, you could use server side scripting like PHP to get it done. What you're talking about is a template, and is used quite often. What you would want, is to have your menu items (and CSS) and your header/footer code in separate pages. This way, if you make changes to the menu, or header/footer, it would be reflected in all the pages (written with PHP) you have scripted with the template method.
You would need the menu.html, header.html and footer.html in a place accessible by your main page code. That is, you would use the template method to write the content of your pages.
A psuedo code example in PHP would be like such:
<?php
include('header.html');
include('menu.html');
echo "Your main content items here";
include('footer.html');
?>
My theme has a custom css code block where I allow the site owner to add any custom css they need directly to the head section of the theme. This inserts whatever they've placed in this block into the wordpress database as a custom option insert.
I then retrieve this content into header.php and output it between an inline style tag like so...
<style type="text/css">
.test h1 {}
.testcss2, .somecss {}
</style>
This works perfectly fine, however, I would like to clean up and minify the markup when its written to the database. I suppose a regex is needed to do this? If so, what would that be?
The result I'm looking for, when the code is written into the page's markup is...
<style type="text/css">.test h1{}.testcss2,.somecss{}</style>
I'd also like to reverse the minified markup when its presented back to the user to edit in my theme options. In that view, I just want to reformat the minified css code so that each directive is back on its own line.
It depends what you want achieve by doing this. I agree with #thomasfedb that you will likely messup the style of most peoples CSS by doing this transformation and will likely cause more trouble than its worth.
It's my suggestion that you keep the data exactly as the user entered it, and then 'minify' it when you render it to the page.
This will not save you and storage in your database, and it will increase your CPU usage per page render, but it will save you the bandwidth of all the extra new-line characters.
Another option, presuming database storage is not much of a concern, is to store the data twice, once where the user edits, and once minified. Then simply minify and copy the user-editable field into the minified field whenever the user makes any changes.
I don't see any real reason to do this, a few newline charactors in a webpage isn't realy going to cost you very much page-weight.
Therefore my solution would be: don't.
Also, even if you reverse the minification, you might 'mess with the style' of some people, who like different css layouts.