How To Create A Premium BusinessWebsite Using WordPress – RYMA ACADEMY Blogs Homepage

#top-nav { background: rgb(239, 239, 239); width: 100%; height: 45px; } #top-nav .content { text-align: center; display: flex; justify-content: space-around; align-items: center; height: 100%; width: 80%; margin: auto; } #top-nav .content p { font-weight: 600; font-size: 16px; padding-top: 14px; } #top-nav .content p .top-nav-btn { border: 1px solid #890c25; background: #890c25; padding: 5px 30px; border-radius: 30px; position: relative; left: 10px; top: 0px; box-shadow: rgba(204, 204, 204, 0.2) 0px 7px 29px 0px; } #top-nav .content p .top-nav-btn a { text-decoration: none; font-size: 13px; font-weight: 600; color: white; } /* main-navbar */ .navbar { display: flex; justify-content: space-evenly; padding: 10px; background: #890C25; z-index: 1000; box-shadow: rgba(0, 0, 0, 0.2) 0px 12px 28px 0px, rgba(0, 0, 0, 0.1) 0px 2px 4px 0px, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset; } .navbar-brand { background: rgb(239, 239, 239); position: absolute; border-bottom-right-radius: 50%; border-bottom-left-radius: 50%; box-shadow: 0px 2px 5px #890c25f0; top: 0px; left: 10%; } .navbar-brand img { width: 16vh; } .navbar-nav { gap: 1rem; margin-right: 120px; background: rgb(239, 239, 239); border-radius: 30px; padding: 10px 50px; position: relative; } .nav-item .nav-link { font-size: 16px; color: #890c25; font-weight: 500; font-family: "Noto Kufi Arabic", serif; } /* Dropdown Menu */ .dropdown { position: absolute; top: 33.5px; left: 0; background: rgb(239, 239, 239); border-bottom-left-radius: 30px; border-bottom-right-radius: 30px; box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); width: 100%; display: none; z-index: 0; padding: 5px; transition: all 0.3s ease-in-out; } .dropdown .short-dropdown { display: flex; justify-content: space-between; } .dropdown .short-dropdown .between-line { border-right: 1px solid rgba(172, 170, 170, 0.616); height: 120px; position: relative; top: 40px; } .dropdown ul { list-style: none; padding: 15px; padding-top: 30px; padding-left: 40px; padding-bottom: 40px; width: 90%; } .dropdown ul h6 { width: 90%; margin-top: 5%; padding-bottom: 10px; color: rgb(110, 110, 110); border-bottom: 1px solid rgba(160, 158, 158, 0.729); margin-bottom: 8%; font-size: 13px; } .dropdown li { padding: 0; } .dropdown li a { display: flex; align-items: center; padding: 5px; } .dropdown li p { font-weight: 500; font-size: 12px; } .dropdown li p span { font-size: 8px; padding: 3px; border-radius: 10px; width: 100px; display: flex; margin-left: 0px; justify-content: start; align-items: center; border: none; position: relative; top: 2px; } .dropdown li span { margin-right: 10px; padding: 5px; border: 1px solid rgba(128, 128, 128, 0.782); border-radius: 5px; } .dropdown li span img { width: 4.5vh; border-radius: 5px; border: 1px solid rgb(240, 234, 234); } .dropdown li:last-child { border-bottom: none; } .dropdown a { display: block; text-decoration: none; padding: 10px 15px; font-size: 15px; color: #333; transition: background 0.3s ease-in-out, color 0.3s ease-in-out; } .dropdown ul .image a { width: 280px; height: 150px; border: 1px solid rgb(234, 234, 234); border-radius: 10px; margin-top: 30px; margin-left: 20px; } .dropdown ul .image img { width: 100%; height: 100%; object-fit: cover; border-radius: 10px; } .dropdown-social-icons { display: flex; justify-content: start; column-gap: 20px; /* padding-left: 10px; */ margin-top: 5px; margin-left: 30px; } .dropdown-social-icons p { width: 35px; height: 35px; border-radius: 50%; padding: 5px; background: #890c252f; display: flex; justify-content: center; align-items: center; margin-top: 5px; padding-left: 0px; } .dropdown-social-icons p img { width: 3vh; padding-left: 6px; } .dropdown a:hover { color: #890c25; } .dropdown a:hover p span { color: rgb(61, 61, 61); } /* Hover Effect */ .nav-item:hover .dropdown { display: block; transform: translateY(5px); } .nav-item .nav-link span img { width: 1.8vh; } .nav-btn { border: 3px solid #aa102f; background: #890c25; padding: 7px 15px; border-radius: 30px; position: relative; left: 30px; top: 1px; box-shadow: rgba(204, 204, 204, 0.2) 0px 7px 29px 0px; } .nav-btn a { text-decoration: none; color: white; font-size: 14px; font-weight: 500; } .nav-btn:hover { background: white; } .nav-btn:hover a { color: #890c25; display: flex; } .nav-btn a span { margin-right: 5px; } .nav-btn a span img { width: 2.2vh; } .nav-btn a span img#red-call-icon { display: none; padding-top: 5px; } .nav-btn:hover img#white-call-icon { display: none; } .nav-btn:hover img#red-call-icon { display: block; } .burger-menu { display: none; color: white; } #navbarNav { display: none; } #navbarNav.active { display: block; } /* .resources-banner{ position: relative; right: 50px; } */ /* Keyframes for sliding in and out */ @keyframes slideInRight { from { transform: translateX(100%); } to { transform: translateX(0); } } @keyframes slideOutRight { from { transform: translateX(0); } to { transform: translateX(100%); } } /* Styles for main mobile menu and dropdown */ #mobile-menu { position: fixed; top: 45px; right: 0; width: 100%; height: 70vh; background-color: #fff; z-index: 100; box-shadow: -2px 0 5px rgba(0, 0, 0, 0.2); display: none; transform: translateX(100%); padding-top: 100px; } .mobile-dropdown { position: fixed; top: 10px; right: 0; width: 100%; height: 70vh; background-color: #fff; z-index: 100; box-shadow: -2px 0 5px rgba(0, 0, 0, 0.2); display: none; padding-top: 100px; transform: translateX(100%); } .more-dropdown { height: 70vh; } #mobile-menu .content .points ul, .mobile-dropdown ul { padding: 0; list-style: none; } #mobile-menu .content .points ul li, .mobile-dropdown ul li { display: flex; justify-content: space-between; padding: 10px; border-bottom: 1px solid #efeded94; } #mobile-menu .content .points ul li a, .mobile-dropdown ul li a { text-decoration: none; color: #333; flex-grow: 1; } .mobile-dropdown .back-to-menu { display: block; padding: 10px; background-color: #f0f0f0; border: none; width: 100%; text-align: left; cursor: pointer; font-weight: bold; color: #333; } #mobile-menu .content .points .mobile-nav-btn { text-align: center; } #mobile-menu .content .points .mobile-nav-btn button { border: 1px solid #890c25; background: #890c25; padding: 8px 25px; border-radius: 30px; color: white; margin-top: 10px; box-shadow: rgba(204, 204, 204, 0.2) 0px 7px 29px 0px; } #mobile-menu .content .points .dropdown-social-icons { justify-content: start; margin-top: 20px; margin-left: 13%; } #mobile-menu .content .points .dropdown-social-icons p { padding-left: 5px; }

How To Create A Premium BusinessWebsite Using WordPress

Last Updated / Reviewed: August 8th, 2023
Execution Time: 30 min – 1 hours

Goal: To create a Premium Business website without much Efforts .

Ideal Outcome You have a high-converting, well-researched, fully functional, and
premium website for your business lead and sales generation that works on all devices.

Pre-requisites or requirements:

Need a Premium Domain [ Your Business Name ].If not Buy From GoDaddy.
Need a Fast Shared Hosting [ Your Business Space ]. If not Buy From Hostagle.
Need a CMS – Website Builder [ like: WordPress ].

Why this is Important : Website are usually the best way 24*7 live your business
online.

Where this is Done: Your Website Builder Ex. WordPress

When this is Done: One Time For One Business before New Reconstruction.

Who does this: One The person responsible for web developer and WordPress Developer.

ROADMAP For Creating A Premium Website!!!!

Start Customizing Your Website .

Note: First of All You Need Two Things:

Domain ( Buy From Godaddy ) Follow Domain SOP

Hosting ( Buy From Hostagle ) Follow Hosting SOP

Step 1 : Go to Your cPanel

Step 2 : Scroll Down and Go to WordPress Manager.

Step 3: Click On Install

Step 4: Select URL & Fill ADMIN details Like: ID, Passwords & Gmail.

Step 5: Scroll Down & Click on to Install WordPress.

Step 6 : Wait 2-3 Min and Then Congratulations !!! Your WordPress is Install.

Step 7: Go to Google and Search Full URL Just like Below:

Step 8: Look This is By default Theme and Sign Of Installation

Step 9 : Login Your WordPress Dashboard to Start Customization.

Step 10 : Hurray!!! You Login WordPress Dashboard.

Step 11: Let’s Understand Your WordPress Dashboard Overview.

Step 12: Click on Appearance to install New Theme.

Step 13: Click on WordPress.org and Add new theme then Search–>
Search Astra then –> Install & Activate it.

Step 14: After Activate Click on Get Started to install Template

Step 15: Click on Theme Details Choose Starter Template

Step 16: Choose Page Builder: Elementor

Step 17: Choose Search and Select Template As per Your Business Niche.

Step 18: After Choose Template Click on it then scroll down and Choose Continue

Step 19: Check are option are Selected and then Click on Build my Website.

Step 20: Congratulations!! Your Website is Ready to Live.

Step 21 : Look Your Business Website………

Look Your Website Before ——–&—–> After