Become a GoHighLevel pro web designer in 24 minutes (tutorial)
Vložit
- čas přidán 5. 09. 2024
- GHL Business Owners and SaaSpreneurs!
Need a custom built GHL website for your business that doesn't suck and helps you get more clients? Let's talk👇
www.unoflowdes...
---------------------------------------------------------------------------------
Get access to my Notion doc for better GHL Web Design here👇
uno-flow.com/p...
---------------------------------------------------------------------------------
On this video I show you how I build websites on GoHighlevel like a pro. This is a beginner-friendly step by step tutorial on the website editor. I talk about 10 different things that I take into account to build better websites for myself and my clients.
Thank you for this! It felt so nice by the end that I could do it!
Glad you found it useful!! More vids coming soon 🤝
this is the best discussion --- very straightforward --- I have watched this week since diving into GHL. Thanks Ricco! May I just ask if the Notion manual you showed in this video is for free or it comes with a cost? would want to learn from that manual :)
Hey Adrian, I’m glad you’re finding my videos/stuff valuable!
The notion is a paid product, you can get it on my site here:
uno-flow.com/product-details/product/notion-board
legend bro
Glad you’re liking the latest videos John!
On my way to becoming the next ricco one tutorial video at a time
🤣📈
@@riccoghl 😆
Great video mate - you earned a new subscriber 👍
Appreciate it 🤝
Great Video Great Work Question I have GHL can you do a website for our small company
I do! We can hop on a call so I can learn more about your business.
It’s the 1st link on the video description
🎯 Key points for quick navigation:
00:00:00 *🎯 Introduction & Overview*
- Introduction to the video tutorial on building websites with GoHighLevel.
- Mention of key takeaways, target audience, and what will be covered in the tutorial.
00:01:12 *🏗️ Starting with the Basics*
- Emphasis on starting with the basics before adding advanced features.
- Introduction to the GoHighLevel website editor and the difference between starting from a blank canvas vs. templates.
00:03:05 *🖥️ Website Structure Overview*
- Explanation of the website structure in GoHighLevel, including sections, rows, columns, and elements.
- Visual demonstration of how to add and structure different components like headlines and sections.
00:04:55 *🎨 Customizing Fonts and Colors*
- Detailed guidance on selecting and customizing fonts and colors for a cohesive website design.
- Use of Google Fonts and the importance of setting up brand colors early in the design process.
00:06:06 *✏️ Building the Hero Section*
- Step-by-step process for creating a hero section with headlines, sub-headlines, and buttons.
- Tips on spacing, styling buttons, and making the hero section visually appealing.
00:10:45 *📑 Creating Additional Sections*
- Instructions on adding different sections like "About" with images, headlines, and buttons.
- Techniques for duplicating elements and aligning content within sections.
00:12:22 *🧭 Designing the Navigation Bar*
- Demonstration of creating and styling a navigation bar, including adding buttons and logos.
- Focus on user experience, ensuring the navigation bar is intuitive and visually cohesive.
00:16:34 *📝 SEO Metadata Setup*
- Brief explanation of the SEO metadata tab and its importance for search engines and social media previews,
- Demonstrates how to add titles, descriptions, and social images for better online presence.
00:17:43 *🧩 Global Sections & Templates*
- Introduction to Global Sections and Global Templates in GoHighLevel,
- Explanation of how to use Global Sections for consistent navigation bars across all pages,
- Shows how to save time by reusing templates and sections for multiple pages.
00:20:29 *📱 Mobile Layout Optimization*
- Focus on optimizing websites for mobile devices after the desktop version is complete,
- Discusses adjusting font sizes, spacing, and avoiding duplicating sections for different devices.
00:22:48 *💻 Adding Custom Effects with CSS*
- Demonstrates how to enhance a website using custom CSS for interactive effects,
- Example of making an image enlarge when hovered over, highlighting the use of CSS for advanced design features.
Made with HARPA AI
💯🤝
Supreme content bro!!! Quick question, have you been able to build a multi-language website, and if you have can you make a video showing how to. Thanks in advance! 2:23
Appreciate that bro! I have not yet.. what I think could work is creating the pages (or a separate site altogether) in the other language, and adding a subdomain (e.g., es.mydomain.com for a Spanish site).
I would then add a button to change the language. When a user clicks it, it would toggle between mydomain.com and es.mydomain.com.
Hope that makes sense! I might create a video on this if there's enough interest.
found this translation service for websites which might be helpful for you:
gtranslate.io/
Another quick question, do you know how to keep the header of your website on the top of the page even when you scroll down the page? thanks
Yes bro, click on the header section you want, and then on the tab at the right if you scroll a bit there’s the ‘sticky’ property so you can set it to ‘stick to top on scroll’
This is probably a stupid question but do you have to host the website on a hosting site to go live after making the website on go high level
You build and host on GHL! Not a stupid question bro. 🤝
Thank you
Do you know how to make dynamic text that will resize when you change the window size?? Been trying to figure it out for weeks
Good idea, I do. Will add/explain it on a video later this month.
in mobile the CTA is not in the same line. How to fix it?
It can be done, but its a bit tricky to get the layout right.
You can play around with the "Column Layout" box on the "General" tab when you click on a column, and change it from vertical to horizontal.. after some clever tweaking I think you could get it done like that.
For mobile tho I keep it as simple as I can, since there are multiple screen sizes. I would also make the button smaller on mobile so it doesn't take as much of the screen real estate
how is your GHL on dark mode or looks like it atleast
You can take a look on my site uno-flow.com if you scroll a bit down there’s previews.
I'm new to GHL, I just wanted to ask after you've built a website how do you make it live using a domain and hosting and all that stuff that comes with it ? Is it apart of GHL?
Good video idea I’ll make a video in it soon 💯
@@riccoghl Yayy Cant wait Thank you
hey Ricco thanks for the video . can i ask you question please , if someone had reschedule the appointment the workflow doesn't work because we don't have a trigger to do that , because in appointment status we found just confirmed , cancelled , show , no-show , invalid. we can't found reschedule . have you please some details if someone reschedule the appointment the workflow be working ?
You can do it. Look into adding tags such as “new booking” and have different workflows trigger depending on if the appointment has the tag or not. Of the same user books an appointment with that tag you know it’s a reschedule… Depending on what you want you may need to tweak your systems until you get it done.
@@riccoghl that's so kind of you ricco thanks a lot
Hope you get it working!
@@riccoghl I will try it