How do I create a website template using html and css? [closed] - html

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 6 years ago.
Improve this question
Maybe I'm not using the correct terminology because I can't seem to find an appropriate answer. I have built a header and a footer using html and css. This will not change from page to page and so I want to make it the template and simply change the content in between the header and the footer for each page of my website. I know I could simply copy and paste the code but if I wanted to change the header for some reason I would then have to change the header on each of my pages! Super inefficient. Coding is all about reuse. surely there's a way to do what I'm saying. Help me web developers!

You could do one of many things:
Use PHP files and require() the headers and footers in the main page, though you'll have to use a server on your localhost to test the pages.
You could maybe take a look into creating single page applications, using AJAX.
AJAX Introduction here.
You could go a step further and pick one of the very popular JavaScript MVC frameworks.
Read more about them here.
Finally, you could also do it the "old way" and use iframes, but that is honestly bad practice and will bring more harm than good.

Related

Simple website (HTML & CSS) - what is the best way to simplify subpages editing? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed last month.
Improve this question
I'm trying to get back into HTML & CSS coding and learn JS. I found so many tutorials which are very helpful, now I would like to develop some simple websites. Many years ago the only way to make subpages (I hope it is a correct translation) was to use iframe or just copy whole content from homepage (so with need of editing every page to change ex. logo or footer). What is the best way to do it now?
Typing "HTML CSS webpage tutorial" in YT returns a lot of awesome results, but it gives me only the solution how to make a design, not a website with working menu etc.
What do you suggest? I prefer to work on separate files instead keeping all code in one "index.html".
Thank you in advance,
Happy New Year!!!
Regards, Mariusz
I have no solution yet.
Nowadays different frameworks are used for that purpose. If you don't want to use one, the easiest way would be to still use PHP and use its include method to load "subfiles" like header, footer, navigation sidebar and other content / website parts that are identical on all pages.
BTW, just a note aboute a detail in your question: The "ancient" method for this didn't use iframes, but frames – that's a big difference: iframes load external webpages, frames (as parts of framesets) load parts of the own website.

How can I create standard layout for multiple pages? [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 6 years ago.
Improve this question
Currently, I am working on my first web page using HTML and CSS. I want to use the same layout like background and header etc but I can't find a way. Today I found a couple of website telling about the template. Is this the related to what I want to do.
Thank you for helping a beginner.
Sam
I would recommend you a few things:
Find websites that make you feel as it is what you wanted to build.
Check their source code and try to find the semantics they have maintained.
Once you figured it out, you should try to create similar one.
You should follow HTML5 specifications , as it will help you build solid foundation. while doing this you will also understand best practices.
HTML or designing mostly depends on requirements. so you might not get one rule to follow, just invest time understanding some great works out there and practice alot.
In case you are very concern to layout, search for website layout images and you will get plenty of images having typical elements like header, navigation/menu, body (left/right sub menu + main content), footer.
You can consider templates for learning but it may lead you to trap of copying-pasting.
You can use Microsoft Expression Web application, which handles template. You make one page and save it as template and declare editable parts for sites. Then You can create multiple empty HTML pages. Finally you attach template, then it works.
Or if you can use PHP, you can create different parts of your Web Site, like: header.php, footer.php, banner.php and include them in every page where modifying the body and not writing the same footer, header, banner

Making a HTML Template [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
So I want to create a template that looks something like this:
http://i.stack.imgur.com/Qf38Y.png (Not enough rep to post photos, I'm new)
(I'm in high school and have just completed a HTML class)
I know how to make the template but I want to make it so that I can just write the title, image location and content in a form or text document and have it create a new html page with the information. I AM NOT ASKING YOU TO MAKE THE TEMPLATE FOR ME! I also need it to be able to update the pages if I change the template. Is this possible? If so please leave any tutorials below. I am NOT asking for you to write the code for me, I am just looking to see if this is possible and what languages it would require.
Thanks Much!
For that you will have to write an application, which will convert the data given by the user into an HTML webpage. This will require using JavaScript, HTML and CSS together. You can create an HTML page which will have <input> tags in it. Then using JavaScript libraries, such as FileSaver.js, you can create an HTML file and add data to it with JavaScript, probably using .appendChild() method. This was for a webapp, that will work in a browser, for desktop app you can use other programming languages or use Adobe AIR to package your webapp for desktop.

From Code Editor to Wordpress [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 years ago.
Improve this question
I recently created a webpage for my using the Codepen online editor. I made it responsive and have everything in place to migrate it to my Wordpress page.
The only problem is I'm not sure how to migrate pure html/css to Wordpress. It seems by it's nature that Wordpress is structured around themes.
What suggestions do you have for migrating the code over so it works in Wordpress?
Also, since most of the coding I do is by hand (not using themes) is Wordpress the best site to use?
If that's ALL the site, then there's not much point in using wordpress - just make it static.
If you want to expand it later and think you'll need a CMS's data management tools, with Wordpress you will have to create a theme. But the bare minimum for that is only a index.php (put your code there) and a style.css (for the stylesheet, obviously).
Just make sure to also add the head markup to your site and you're good to go.
Any time you add a database -- wordpress, joomla or other -- you're slowing things down. If you're expecting to be managing over 50 pages, that's a good trade-off, but if not, you're probably not making use of the best parts of wordpress.
One thing with Codepen: It has a few helpers -- autoprefixer, normalizer, maybe you're using Sass? Built-in helpers. Make sure they are compiled into your final CSS/HTML.

getting rid of redundant code between html pages [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
So I'm working on producing my own version of a web/db project my friend was given in school. This is my first project in either area and I'm still learning. Part of the project description mentions all of the pages the client wants. I'm solving this by making an unordered list of links to the different pages with appropriate labels. Complex, I know.
Then I realized that every page will have this. My question is this: is there a way to class certain portions of code in html, so I can just have a "navigation list" in each page, instead of the full code of the list and everything associated with it, in every page?
I want the code to be clean and efficient. That's my motivation in this question.
Your question provides little detail, but it sounds like you want something like a php include. If you are running your site on your local, change the .html files to .php and do <?php include('includes/navigation.php') ?> where includes/navigation.php is a path to JUST your navigation code.
What you are talking about is templates. You cannot do it in plain html... You would need to use a server side language like php. You could also do it with a JavaScript templating language like handlebars or similar, but not in plain html.
If you don't want to use PHP or some other server side technology for a simple menu, you can try various Javascript plugins like MenuCool.