After creating homepage on my previous blog. I want to add and customize contact page where people can get in touch with me. To do this, on my Wix Website Editor, on the left bar menu, click on Site Pages and Menu. Then click on Add Page on the bottom of that box. A new box will pop up, on the left side of it, I click on Contact so I can use the template. There's many on template that I can use. After gone through, I chose Visual type. I hover my cursor on that, and click Add Page. Now I have unedited contact page.
Before I further my customization, there is a important step. I need to set the Form Settings connect to my gmail address, so when people fill in their information, I will receive a notification in my mail. To do that, left click on the contact form and a Form settings button should pop up. I click on that, on the main page, bottom of the box I click on Set up Email Notifications options. After that, my email address that I use to create this websites are addresses, I click on Set Notifications. Now anyone who fill up that form will be notify in my email.
Onto the next steps, I want to customize my form style. As you can see from my screenshot. There is a paragraph under Contact Us word. I delete that paragraph by double click on the text and press delete button. Now I want to change the font of the Contact Us. First of all, I double click on the text and change the text to Contact Me. Then I click on the text and click to Edit Text. I set the Style to Heading 1* pair with Bitter Black fonts with 80 font size.
Next part, I want to change the body of it. I want to change the background image. I go straight to Unsplash and search for Purple Neon image so it could be well blended with the colour of my websites. Then after I found one, I download the picture, and save it to my desktop. Back to Wix Websites Editor, I click on the image and click on Change Background. Then a box appear, I click on image. A new box appear, on top left of the box, I click on Upload Media and Upload from Computer. Then I locate back where I put my image which is in my desktop, click on it and open. Now, on bottom right, I click on Change Background and my image now change.
Now on right side of the form, I delete all the unnecessary text. I delete by click on it and press delete button. Then I change the font of the text by click on the Wix Forms box. Then, the menu with logo should appear. I slide to design which have paint logo on it, and I click it. Box pop up, click on customize design. Next, I go to Input Fields and go to Text. I keep the font colour black with 100% opacity and the heading. I change the fonts to Fraunces and size to 14 with bold. This should apply to all Field Title. Then I click on back button, and click back to Submit Button. This is to customize the submit button. I click on Text and change the colour to white to it popping out. I change the fonts to Avenir with 16 fonts size and keep it bold. If anything necessary to add, I will add it later as this is my first time ever creating a websites.
This is all for my contact pages. Additionally, I want to add a social links in my websites so people can take a look of my work. Essentially, Blogger is my social links as mandatory. I do this by, in the Wix Website Editor, on the left bar, I slide to Add Elements and box pop up. I slide to Social, then Social Bar. On the social bar, I drag which one I like the most. I dragged it into the footer so it will be on every pages. Now on the social bar, I click on it and Set Social Links should appear. I click on it and now it bring me into new box page. There are unnecessary socials links so I need to delete it. I do this by slide my cursor to the logo and there will be a trash can icon on the bottom left of the small box. I click on that and I did this for all the the icon. Now I want to add a new icon which is Blogger. I do this by slide to Add Icons orange box on top right, now I am on new box page full of icon. I search for Blogger icons then I click on it, on the bottom right, there is a blue Add to Gallery button. I click on that and now my blog icons should be added. Now, on my Blogger icons, I need to add a links so when people click it, it will bring to a new windows where my blogger is. On the same box page, on the right bar, there is a What social page does this icon link to? and click on the bottom of it. Now What do you want to link to? box page appear. Next, I copy my blogger address and paste it on the URL box. I make it a new window open. Then I click done. Now my social link should be functional.
Then, I want to make sure my contact page look alright in the mobile view. I click on mobile icons on the top left bar, and now I can see how my page should look like in mobile view. There is an error where m header are covered. I fix this by dragging the header a little bit down by clicking on it and there should be a drag orange icons. I click on it and move it a little bit down. Now, my header look alright. I can see my name. Then, I click save and my progress are now saved.
Comments
Post a Comment