Description of HTML PinkPen template
At the top of the site is the site name. You must enter your site name here. Below that is a link to other pages on the site, such as About Us, Contact Us, Portfolio. If you do not like this pagination, you can easily change it. After that, there is a photo as a site header. You need to choose a photo that suits your company or person. And below it, you can put your desired content and at the bottom of the page, we put the copyright of the Html template designer. You can see its demo in the image below.
PinkPen template file
customize pinkpen template
Well, now it’s time to start customizing the PinkPen template. The first part we edit is the title of the website. The text you see at the top of the browser. All you have to do is go to the sixth line in the index.html file. You can put any text you want between the <title> tag and save it in this section. The photo below will help you a lot.
The next part we want to edit is heading one. As we said before, we only use the index file for editing. Go to line 24 of this program and put any content you want between the <h1> tags. By default, the value is pinkpen, but you can change it to your liking.
Edit page names in the PinkPen template
The HTML Pink Pen template has 4 pages that we are going to edit their names. The first page is the main page, which is actually your home page, and you should put the content of your first page on this page. The next page is about us. On this page, you write the information about yourself or your company. For example, where did you start and what is your education and where do you like to go. The next page is the page where you can place your or your company’s portfolio. The last page of the HTML PinkPen template is Contact Us. In this section, write the address of yourself or your company. Enter contact number, social network ideas, fax, etc. At the bottom of the page, there is a form to send you an email and message.
You do not have to work hard to edit the names of these pages. Go to the 27th line of this program and edit the <li> tags and put your favorite name on the pages. You can also search the page names in the code and edit that name.
change header image in the PinkPen template
Well, the next step is to change the site header image. If the site is a company, you can put a picture of your company. If your site is personal, it is recommended to post your own photo. To add a photo to the site header, you must first place that file in the img folder. To add a photo to the site header, you must first place that file in the img folder. Then go to the 36th line of the program and edit the <img> tag and replace the name of the new photo with the name of the previous photo.
Edit the main content of the pages
On the main page, we have a second heading and a paragraph. To edit the heading, go to line 37 and edit the <h2> tag. To edit a paragraph, go to the next line, line 28, and edit the <p> tag. If you want to add tags (photos, paragraphs, headings, etc.) just add below these. You must go to line 43 to edit the About Us page. Edit or delete or add any tag you want. To edit our portfolio, just go to line 53. To edit, you need to be proficient in Html code. The last page of the HTML Pink Pen template is Contact us, which you can edit on the 59th line.
Well, the PinkPen template editing tutorial is over. I hope you found it useful. If you have a comment or question, be sure to ask in the comments so I can answer you. Oops, I forgot to put the link to download the template for you 🙂 Okay, I’ll put it down for you.