How to Make a Parallax WordPress Website - Step by Step for Beginners!
ฝัง
- เผยแพร่เมื่อ 10 มิ.ย. 2024
- Learn how to create a website step by step using WordPress. Super easy & fun with zero coding! Discount Hosting: www.siteground.com/go/unlocked
Download Free Theme: crtve.s3-us-west-2.amazonaws....
Contact Plugin: crtve.s3-us-west-2.amazonaws....
Download Images: crtve.s3-us-west-2.amazonaws....
In this tutorial - you'll learn how to get your domain name & hosting, install WordPress and make a website & blog step by step. You'll also learn web design techniques that you can apply today to make beautiful websites.
- Fully Customizable
- Drag & Drop Builder
- Theme & Templates included
- Easy to Setup
- Perfect for Beginners & Freelancers (Many Advanced Options Too!)
- Fully Mobile Responsive
- No Expensive Software - WordPress is FREE & Open Source which powers over 37% of the internet!
Contents
Introduction 0:00
Overview 01:16
Domain & Hosting 05:05
Install WordPress 08:16
Configure Basic Settings 09:55
Install Theme 13:37
Add Pages & Custom Menu Links 15:33
Set Static Home Page 16:48 (Important: Or you won't see builder)
Configure Themify Settings 17:54
Web Design Tips 27:15
Add Social Links 38:59
Build Homepage
Hero Image 41:01
Subheadline 47:43
Transparent Header 51:04
Buttons 51:41
Add Post 1:14:26
Change Post Date 1:17:42
Add Google Map to Website 1:20:02
Important
Set in Row Anchors (Important) 1:28:00
Make Website "SUPER" Mobile Responsive 1:30:01
Additional Customized Sections 1:34:43
Create Logo and Favicon 1:36:31
SSL Secure Your Website 1:45:20
Add Additional Pages & Built in Layouts 1:48:04
How to Update Website 1:53:04 - hoganchua.com/update
Conclusion: 1:55:21
Resources
My Recording Equipment: www.amazon.com/shop/hoganchua
Free Web Design Guide: hoganchua.com/website-design-...
Website Resources: hoganchua.com/ultimate-websit...
FAQ: hoganchua.com/faq
General Installation/Issues: support@hoganchua.com
Best Screenshot/Screencast Tool: www.getcloudapp.com/
This is the 6th website I've built Using this Tutorial, I'm learning WP because of you. Hugan Chua For president! Seriously though I've replayed this vid 20 times I follow inch by inch you don't miss a single step. I owe you one and hope to find a way to give you something, at least for now a giant thank you. I have had people in my one business tell me they "know" I'm good because my website is so nice. Its a huge thing to have this ability Thank you!
Hogan, where have you been all of my life? You are an amazing instructor and THANK YOU for sharing your skill. I wish I'd found you sooner; better late than never.
As a web designer, I was always confused about the colors, fonts, picking the right image, etc. Your guide really helped me to work on a guide, I usually don't like, comment, or subscribe to videos on youtube but when I read your guide I thought you deserve all. Thank you Hogan it really takes a lot of effort to create a guide like this. Thank you for everything.
This has saved me so much time and money. You’re my hero….since 2018.
I have never watched a video for 1 hour without losing interest. This guy is superb
Glad you enjoyed it! If you found it helpful, it would be awesome if you can give it like :)
Hogan, you're the greatest web instructor. this website building tutorial is exactly what I needed.
Thanks alot Hogan you don't know what help you have just provided to a website designing aspirant who had lost all his hope to be a webdesigner one day
Just cannot stop blessing you
Thanks a lot once again keep serving community like this
May God bring good to you for all your efforts of kindness
You're very welcome!
I spent literally weeks looking for the best solution. Your website building tutorial was a great find.
Most of the TH-cam how to make a website videos I watched overwhelmed me with their words, but yours was SUPER easy follow.
Been following you since 2016, this is a great refresher.
Hi Hogan. Thanks for your videos. I have used your videos for creating amazing web pages since 2014. You have such a talent to explain complicated stuff in an easy way.
Thank you so much. God bless you.
I just wanna say you are the best always🙏 thanx a ton . ✨✨✨
Thanks
I have revisited the tutorial and have the answer. Thanks again Hogan
Awesome tutorials Hogan. I really enjoyed it and learned a lot. Thumbs up. Continue the good work.
You are absolutely awesome - thank you for this amazing guide!
Thank you so much for your build a website video. You are really helpful. And your way of explaining is simply the best.
You are the best Hogan, I´m a absolute beginner and my Website looks great. Thanks for teaching!
You're very welcome!
thank you! Awesome tutorial, finally something, that I understand!
so happy I found your build a website video. thank you for your time and expertise. God bless.
Hi Hogan! Saw it today for the first time after stepping into your tutorial by accident !! It was my lucky day!!! Sooooo awesome and absolutely well done! A fully bright explained tutorial extremely clear!! Cool man! Finally something reeeeeaaaally helpful from minute 1!!!
Shake hand Hogan!!
Giorgio - Rome (Italy)
Hogan may I ask you something? Probably something really simple to do but right now I'm not finding the clue: when I insert a post block the pictures inside the block are "rounded" in the corners and not square like on your tutorial. I don't know where to look anymore!! Thanks in advance.
Hey Hogan, Thank you for another of your amazing video, you are really helping out a lot if people in here including me for sure.
My pleasure!
Im starting my ecommerce store from Australia, so glad i found you!! Keep it up :)
Hi Meaalofa Tupua,
Thanks! Looking forward to your success and hope to see your site soon :)
Got more question? You can visit theFAQ page. [www.hoganchua.com/faqs]
Cheers!
Hogan
Thanks so much for this how to make a website video. It was super helpful for a newbie like me and thanks for the web design tips!
What an amazing create a website tutorial. You have awesome teaching skills mate. May the force be with you :-)
I love your tutorial. It saved me a lot of time and headaches.
Thank you Vio :)
Wow Hogan still makes WordPress tutorials, much love man learnt a ton from you back then.
Hi Arthur Obo Nwakaji,
Thank you!
Got more question? You can visit theFAQ page. [www.hoganchua.com/faqs]
Cheers!
Hogan
Thanks bro, I watch every Clip you posted. Ur my permanent Idol, Hogan
I didn't do anything actually,i was looking for something else, but Dude you just got yourself a die hard fan....the best 2hrs video on the internet for free ....Thanks for sharing
Thanks Kelvin :)
@@HoganChua please i followed up with the tutorial , i'm missing the username and licence key for updates ...would really appreciate if you could be of help once more ....kelzb042@gmail.com thanks in advance
@@kelvinbrown5569 You can update the manually theme here: hoganchua.com/update or if you want support/automatic updates the link is there :)
Thanks Hogan. Just completed most of the work. Thank you for creating this video
Glad you found it helpful
Thank you so much for making this website building tutorial free
You're very welcome! hoganchua.com/faq if you have any questions.
I just completed this video after 2 days! :D thank you so much Hogan.
You're very welcome!
Super useful guide in a very clear video! Thank you!
Thank you Silvia :)
Just the video I was waiting eagerly for. Thanks a lot Hogan.
Thanks Oliver!
*"Builder not available" - Watch this to easily fix: **th-cam.com/video/RPl6EDKnWJ4/w-d-xo.html** (will take 30 secs)*
*FAQ: **hoganchua.com/faq* :D Hope you guys enjoy this video!
Hogan chua I can I contact to you if you have chance akhalif229@gmail.com
Thanks
@Hogan at it again.
Thank you so much for this yet wonderful tutorials
My pleasure!
This is soooo helpfull!!! Thanks so much for this! Ur awsome🙌🏻😁
Thanks
I've been waiting for this .... thanks!
No problem!
Thanks a lot for providing me the inspiration in how to make a website ^_^ . Thanks to you I’ve learnt a plenty of things.
Happy to help!
Finally, a video that actually goes step by step. Also, I love your voice!
Thank you!
@@HoganChua hi .... been trying to update the theme but not finding the update file on your website
disregard....
Aliyah he's single
hello Hogan, Thank you for your amazing video it is very helpful and easy fallow the instructions
He visto millones de vídeos tutoriales sobre como trabajar en WP. Tu tutorial es ameno, completo y lleno de contenido. Muchas gracias por tu trabajo.
Hogan, Thanks for the excellent WordPress tutorial. While working through this tutorial, I noticed that at approximately 40.24 while setting the Footer Social Widget, I get a very different looking screen. I have the latest Themify Ultra, and Themify Builder pro, so it appears you have other plugins or options installed which cause the difference I'm seeing. Please help..
This is awesome! Thank you for making such a great website design tutorial for Themify Parallax theme.
idk how I missed your video!!!! You're tha man!!°
I appreciate that!
All your videos deserve to get likes. I learnt a lot from you particularly how to customize "Themify Theme" which is my 2nd best favorite WordPress Theme.
Thanks ! :))
@@HoganChua You're most welcome Hogan...
I know everyone has already said it but your tutorial was incredible. It has helped me sooooo much - THANKYOU Hogan! Ive seen so many tutorials but from yours it seems you must love what you do because you know your stuff and everything is so comprehensive, well organised with plenty of resources for follow up...I'm a life long subscriber now!
if I may ask a couple of questions please... if I want to have new blogs say every week, what is the most space efficient way to do this please? Also if I have a lot of information to include in the about section, Is it better on a seperate page?
Thankyou again for the tutorial and your time!
viola
Hogan, you are amazing thanks for this create a website intro course. Please continue making more video particularly website videos
We will!
Hello dear Hogn - Brilliant introduction - thanks. your videos are a great resource for any one just starting out in all things Parallax and WordPress: You provide an in-depth and crystal clear walkthrough of very important topics. Would you do some vids about the new Version 6.1 That would be awesome!
Hello Hogan! Thank you so much for this video. You explain every detail, step by step, and make everything so easy to understand. And thank you for your generosity sharing the theme and the knowledge.
I don't know if you'd have time to answer this, but I would like to know how to place a video instead of a hero image, with the parallax effect on it. I managed to place the video, but it's fixed, not with the parallax effect on it.
Congratulations for your channel and greetings from Spain.
Great work and thank you for the great work
Thanks Darbaz
Thanks Hogan for your work
My pleasure!
Thank you so much for this Hogan
No worries!
Hello Hogan thanks for these tutorials really helping alot but I have a query can i add text to each image of slider by using the builder function. Thanks in advance
Hi Hogan, Thanks a lot for this great tutorial. I've one question. I use the Gellery with the lightboxed design but I've not found an option in the styling settings to disable the social media buttons at the bottom right of the picture in the lighbox. Do you have a tip on how I can remove these social media links and icons?
Hi Hogan, This is my go-to tutorial for all the websites I've recently designed. Outstanding instruction. Thanks. I've got a query. If you have a few posts set up under one of your menu headings what is the best way to display them together in a post type setting on the front page of a parallax site. Many Thanks & Kind Regards
Thank you Hogan for this great tutorial! Is there any option to change the settings for the link preview, for example when you share the Website in a messenger?
Hi Hogan, thanks for the tutorial! Is it possible to add a gallery plugin in the Gallery section? Many thanks
An excellent tutorial Hogan. Thank you. I am not a designer as such but I’m about to start designing a site using WordPress. I have however already subscribed to another host. Am I still able to use your system to adapt this theme?
Hi Hogan, thank you for your very useful tutorial as always :) Could you please let me know what version of PHP this Themify theme supports? Thanks a lot !
Hi Hogan, thank you so much for your videos, especially for this amazing tutorial. I just have a question, I followed your steps, but my websites displays a grey outer margin. I have been looking for ways to expand my page so that it covers all of the browser's window, but I haven't found any option to do this yet. I would be super thankful if you could tell me how to get rid of these margins. Cheers!
Hi Hogan! thanks for you work. Could you help me, please? I'm setting the sidebar widget but I don't want it on the homepage too, just on the single pages. Is it possibile?
Hi Hogan! Hope you can teach us how you make your videos as a full course too
Great Tutorial. Please do a video on Themify Portfolio website
Hi Hogan, thank you for your awesome tutorial, it really helped ! I have one issue with my gallery actually. I want to create a "portfolio" page with images displayed on it. I linked the image with their original file link and display them in a lightbox in the same page. I like the simple look of the lightbox, but i want to get rid of the social tools at the bottom of the image. Can you help me with this ?
Thank you for the video. It's brilliant. none of the themify ultra widgets are installed on my WordPress backend. If I do install the 4 that is there it says: Something went wrong with the API. Please assist!
So good
Hi Hogan,
The widget section in dashboard doesnt appear like it is shown in the video! There is no option to drag
Thanks for the great video. Is there a way to make the mobile navigation menu to fill the screen when you tap the burger menu? My theme is Themify parallax.
Hi Hogan, thank you so much for your help regarding the google map. I have now had a request to add a button to direct customers to a customer login to a purchasing area located on a separate server. I have been supplied html file, but don’t know how to get this to work as I’ve been using themify.
Are you gonna be making an elementor wordpress tutorial too?
Hi Hogan Chua, your video is amazing. I have created a website using Themify Ultra and following your tutorial. Everything has gone well except for the mobile version. Every time I make a change in the mobile version, the desktop changes as well. Could you advise on it?
Hello Hogan. Thank you so much for this. This has helped me have something great and affordable. However, I cannot get the menu datalink to work. I’ve redid my site from scratch and for some reason it won’t go to the section. Any advice regarding this?
Hi Hogan - I like your way of building sites, and I'm impressed by you insight. I therefore hope, that you can help me. How can I change (make smaller) the line height between bullet points - kind of like the height between sections. Right now I define separate modules for the bullet list and set the line height to 0.5em. It works but is not really elegant. Where are bullet lists defined? Is there some clever CSS that can be added? I have looked for quite some time without finding a solution anywhere.
Hey Hogan, can you please make a free stock images&videos website??
Also i wanted to ask if there is just a better and simple way to turn your e-commerce website into a mobile app for Android or iOS??
I appreciate your work man you are amazing! Thanks
Hello Hogan!! Thanks a lot for your video!! Thanks to you, I am doing my first wordpress website!! A have a question for you though :
How do you adjust the interlign space? I've tried playing with the line height but it doesn't work like I would.
I have a full paragraph where I start a line line after each sentence...and there is too much space betwen the lines!!
Thanks in advance for your help :)
Hi Hogan thanks for this video.am trying to add a blocks from the themify builder but it shows failed to load pre_ designed rows from server.pls how can dis be fix
Thanx!
You're welcome!
Omgggggggggg Hogan... thank u so very much
You're welcome!!
Hogan... me tired... been creating this site for bout two days... coming slowly but surely
hello again sir can i add an image in the header menu in top left corner or can i use logo and text both in the header.
thanks in advance
Excellent video - One question; how to remove the red circle with arrow in bottom right corner?
Hello you this is video very good i like thank you 👍👍👍👍
No problems!
I followed each step to create a parallax WP website, which looks great! Thank you! However, once a user views a blog post on mobile and then opens the hamburger menu to return to a new page, the mobile menu is entirely white with live links that are not visible (or white on white). However, the hamburger mobile menu on the home screen has a background and colors for the live links and operates correctly. Do know why this could be and how to fix it?
Hello, i am follow your steps. Great work. Could you help me with the caching??? Or suggest a solution. I already change something in my site but when i check it live, it is not. I CLEAR THE CACH from the browser.
Hi thank you for your amazing tutorial. Its been very helpful. I have made my webpage following your last tutorial in 2018 and i just tried to download the new version of themify builder from the link in this page and upload it, but the uplaoding is keep failing. And directly upgrading the previous one requires id and password in themify webpage which I don't have. What do you suggest that I do to use the upgraded themify builder?
You can go to hoganchua.com/update - you need to re-install as theme. Not as a plugin.
Hogan is the "Themify Ultra" link you included free of charge?
thank you so much for such a fantastic video, but I feel so lost and would appreciate if you can help me. I have started creating my website with elementor. Is it possible to do parallax effect with elementor for free?
Hi Hogan, You are awesome, thanks for the great video. My question is how can I make the website a shop: with items, variations, cart and payment?
Hello Hogan I followed your last tutorial to make my last website and Im trying to make another one but I already have hosting through host gator. I like to know how do I make the website using host gator I also already have a domain name as well. Thank you
Hi Hogan, Thank you for all great tips and tricks working with Themify.
I´m looking through your videos again, also searching on Themify homepage how to embed a Facebook window. I can place it at the bottom but like to place it in the layout. Is it possible at all in Themify? Think I spent to much time instead of asking "how to".
Best wishes for a Happy new 2021! //Folke
Just solved, don´t know how but it works, Happy New Year
Awesome!
Great job. I've applied this video from a to z and now need an Amazon Buy Button. Could you create a video how to do this with Themify. I could only add a block at the beginning or end of my website--but not in the middle. Any suggestions?
Hi Hogan! Thanks for greate tutorial, free theme and also materials. The only question is will that theme be free forever or just as a trial. Because othervise it means that I waste my time to learn this page builder, and believe me it takes a lot of time (I'm the new one in this field). If you let me knowб I'd apprуciate it.
Hi Hogan. Q: How can I change the way the excerpt in the posts are shown? Can I change the length of the excerpt? And can i change it to left-aligned instead of centered? THnx! ;-)
Hi! First of all thankyou for this amazing tutorial! I learned a lot from tis video. I have one question : so I have an image and a button below the image. But what I want is, when I hover over the picture, then the button appears. Is that possible? Thankyou for your answer!
Hi Thomas Maelfait,
Do you know any site that has this feature? Can you send the link here so I can check?
Got more question? You can visit theFAQ page. [www.hoganchua.com/faqs]
Cheers!
Hogan
@@HoganChua Hi! Here is a link shop.mango.com/be-nl/heren/opvallend/sale_d14332139 , when you hover over the image from the product, there appears something. I want there a button... you understand?
Regards!
Hello! Thank you for your time and effort. I have been creating my webpages based on your videos, so you are doing a really great job! I gave a question about the video. When I insert a video, is there a possible way, that there is no buttons or the lines down (I do not know how it is called, but the line that shows how vide is long ect. ). I want to add video on hower at the top of my webpabe. But even if I add - record automatically, it shows the line down. Is there a possible way, that the video is without anything? Thank you very much for your time!
I think its not really 100% possible. the most you can do is with Tubebuddy (TH-cam tool) - th-cam.com/video/dFUYsbbf6U0/w-d-xo.html&feature=emb_title - you can use it for advanced embeds and edit some visual settings. hope that helps!
@@HoganChua thank you for your answer! Will try! You are the best! And also you are one of few people who actually responds! Thank you
I love you Hongan Chua .....it's perfect and complete guide step by step ..amazing
Thank you for your kind words!
@@HoganChua you welcome sir
Hi Muhammad Aqeel,
Thanks!
Cheers!
Hogan
Hey Hogan, thank you for the awesome video! Do you have a tip how to change the color of the "jump to header" button that follows while scrolling down? Also, I am looking for the best way to set up the webpage in two languages. Any best practice tips for that? THANK YOU SO MUCH
Hey there
1. Go to customizer > themify options > advanced tab > footer > back to top . Should be there.
2. I recommend weglot :) i have a ecommerce multi lingual one. Check that out on my channel and check the description for timestamps.
Hope that helps
Hogan Chua thank you mate! Greetings from Germany
Hey Hogan the SiteGround Optimizer is no longer available is there another i should use? TIA mate
Hi Hogan,
Thank you for this perfect tutorial.
However, I have a problem inserting text on my background as you explain from 44:00. I can insert it under my backgroung image but not above.
Also, my website is not responsive.
Could you send me advice to solve these 2 errors.
Thank so much
KR
Nice tutorial indeed . You have video on how to add register page ? Where clients can login to their back office ?
Thank you. No I dont have a video on it. Should be some on youtube and this is how you can customize the look : themify.me/blog/how-to-design-a-custom-wordpress-login-page
this works on iphone? safari? i ask because of the parallax effect