How to create another html page in visual studio code? - html

I need to create another page for my website, because I AM DONE with my homepage, i am newer to coding, so please explain it very thouroghly and remember IM USING VISUAL STUDIO CODE thankyou anyone!

Simply add a new file at the top left corner. then give it a name of you liking and an extension that you usign like .html
Then you write that new page like you wrote the first page and add links beween both sites with the link tag.

I would say save your index.html as about.html. This way all you need to do then is edit the content. The CSS file and all other items will still be linked.
FILE > SAVE AS > about.html
Edit the content for the about page and repeat the steps for each page.
In your index.html file you can link to your about.html file like this
<a href="about.html>ABOUT US</a>
This will be the quickest way. Then you wont have to start from scratch with every page.

Related

CSS not linking to new HTML pages (Breaks on other pages except for index.html)

This is pretty much my first go at HTML and CSS. I thought I was getting a hang of it until I added more pages. I wanted each page to have the same top navigation bar format, but when I linked the same CSS Stylesheet to all of my pages it just doesn't want to work? How should I go about fixing this?
Also, somehow my google fonts link did work at first, but once I added in the pages and tried linking the single stylesheet to all the pages, it stopped working completely.
Here's what is going on:
index.html file code & link href to css
Preview of index.html/my homepage
menu.html file code & link href to the same css stylesheet
Preview of menu.html/menu page
My CSS stylesheet
The preview works with index.html, but when I navigate to the menu page, or contact page I have created through the preview, it completely breaks and doesn't have the navigation bar I created across all the pages at all.
Did I do something wrong here? I tried creating multiple CSS files and gave them different names since each page is going to look different anyways, but kept the html the same across all the other html pages and the css the same.
The reason why the css script is working for the index page only is because index.html is the only script that has the right directory to your css script. So the browser can't find the css script as a result. Remember that the other pages are not in the same location as index.html (they are in Pages instead of the root directory). All you would have you do is just change the directory path on the other scripts.
Add this on all your other scripts (excluding index.html):
<link rel="stylesheet" href="../CSS/style.css"/>
It should work after this.
Here is an example:
Your actual problem is not knowing how to navigate from one/folder to another. This link below will help you further on how to navigate around folders.
https://learn-the-web.algonquindesign.ca/topics/paths-folders/
Don't take out the files from Pages but leave them where they, all you need to do is to change the path to the different files. You'll see how I did on the screenshots above.
If I had more time I would go more in detail but this should be sufficient info for you to solve the problem and understand what mistakes you made. I hope this helps.

Internal Links in HTML

I have a lot of internal links I want to use for the first website I'm building. It works great when I run it locally but none of the internal links work when on the actual site. For example, here is one internal link I'm using.
Read More
I understand why this doesn't work, but what link can I put there if one doesn't exist yet? I guess how do I create sub pages for my website?
Thanks in advance!
Here's simple example, You cannot use absolute path on server, but relative using .. (back to parent directory) or . (current) to link to file that you need.
If you don't have a page yet, leave it #
like Click here
You can put relative links in each page. Lets assume your site hierarchy is such:
index.html
category-a.html
category-a/page1.html
category-a/page2.html
category-b.html
category-b/page1.html
category-b/page2.html
The link from index.html to category-a.html would be:
category a
The link from category-a.html to category-a/page1.html would be:
page 1 of category a
The link from category-a/page1.html to index.html would be:
Home

mitigate static html pages from xampp to wordpress

I have developed a website using xampp. And I want it to replace a current website on Wordpress.
I tried looking for tutorial/steps online, have tried a few, nothing seems to work.
I desperately need to upload it, so it would replace the current website. So any help would be greatly appreciated.
P.S: the website is fully static, no database is required.
Remove everything in the wordpress folder (or move it to a subfolder for the time being while you test) via ftp and upload the html site. As long as your new site has a index.html/index.htm it will replace the wordpress site at the url.
Step 1. Create Template in theme folder
Step 2. Give Template at the top of the page Like this
Step 3. Place all Html code below the template name
Step 4. Go to wordpress dashborad choose your template 'CustomPageT1' from dropdown
Further Detail check the link below
For Example: http://www.wpbeginner.com/wp-themes/how-to-create-a-custom-page-in-wordpress/

How to add a HTML Home page to a prestashop page

I've developed a custom HTML homepage for my prestashop site, but it seems I do not know how to incorporate it, I've tried looking into the prestashop forums, but all it shows are for .tpl files, is there a way for me to link them to the homepage?
Can I just link it as an html page or do I really need to put it inside a tpl page for it to work?
Create your .html file (say 'test.html).
In test file you need to
add these lines of code before your html code
<?php
include(dirname(__FILE__).'/config/config.inc.php');
Tools::displayFileAsDeprecated();
include(dirname(__FILE__).'/header.php');?>
Also add these lines after your html code
<?php include(dirname(__FILE__).'/footer.php');?>
Place the test.html file in the public_html folder.
Now you need to add the page to link with your site.
If it is home page you need to add it to index.php otherwise you can just add the url (http://mysite/test.html) to menu bar or footer links, where ever you want to put it.
I have placed my php page link in the footer information part using anchor tag as shown in the image
In prestashop you can find "Home Editorial" module, in this module you can put your html obviously the module need to be transplant in displayHome position.

How I can do this on html

I have a website and I've been searching a lot for this question and can't find anything yet.
Anyone knows how to make links take you to another folder and show the html page without page in URL? Example:
I have a html page called service.html and its on folder /service. I want a link to take me there without displaying in the URL my html file like:
click me
And it takes you to the html file and shows your content without displaying the html name in the URL. just www.example/service/ :D
Calling the file index.html instead of service.html should work, if the website is currently hosted.
You can use the method #tasteslikejava mentioned, or you can create a .htaccess in the services directory and put in the following information:
DirectoryIndex service.html
Is that what you want?
link
How to link html pages in same or different folders?