Category: Wordpress Development

Astra Theme Wordpress How To Make Mobile Nav Scrollable

Astra Theme – Mobile Navigation How To Make The Drop Down Navigation Bar Scrollable

Mobile Menu Not Scrolling on Astra Theme?

Recently, I was working on a website that had the Astra WordPress Theme along with Elementor Page Builder plugin builder.

Everything was fine until I started to work on and edit the mobile navigation.

This particular client had sub categories or a drop down sub navigation menu displaying under the SHOP main navigation item with approximately 50 categories.

Each time we would select the Shop drop down then attempt to scroll down to view more categories, the navigation would disappear on mobile.

 

Mobile Menu Disappears Astra Theme Elementor

 

We created a separate menu called “Off Canvas Menu” under Appearance –> Menus –> Create New Menu.  Then ASSIGNED this menu ONLY to the “Off Canvas” Selection at the bottom checkboxes below the menu to assign only this menu to this area.

Create Separate Off Canvas Menu - Mobile Menu Disappears Astra Theme Elementor

 

Create Separate Off Canvas Menu - Mobile Menu Disappears Astra Theme

We added our menu items and the SHOP then added the sub categories below the shop.

We then clicked on Appearance –> Customize –> Header Builder and at the bottom left of this new screen you will see the option to select DESKTOP ICON – TABLET ICON and MOBILE ICON.

We selected both the TABLET and MOBILE icons and removed the PRIMARY MENU that was assigned to the OFF CANVAS MENU on the right side of the screen. Simply click below the text on the right called PRIMARY MENU and you will see a + sign then you can ADD the new OFF CANVAS menu to the OFF CANVAS section. You will want to REMOVE the PRIMARY MENU from this location.

 

Off Canvas Menu - Customizer Elementor

 

So now you have the PRIMARY MENU on desktop and the OFF CANVAS MENU on tablet and mobile devices. You do not necessarily need to do it this way but we are able to control the mobile menu by itself as this client also wanted a search bar at the top of the menu and on our desktop version the search is last in the list on the menu.

Next we head over to  Appearance –> Customize –> Additional CSS and add the following code:

 

/* mobile sub nav scroll */
.ast-header-break-point .main-header-menu .sub-menu {
z-index:999999;
display:block;
height: 220px;
max-height: 220px;
width: 100%;
overflow-y: scroll;
}

 

Once you add this code above, save within the customizer and then view the site on mobile.

 

You should now see the mobile navigation and be able to select the SHOP (or whatever you are calling it main navigation item with the drop down categories) and see the categories below it and they are both scrollable and do not disappear when you scroll.

I was looking for a solution to this online and Astro was trying to point me over to a PAID ADD ON (of course you can’t blame them) but FREE is always better.

If you need help with this type of integration or just looking to have a beautiful, professional website developed feel free to contact After Dark Grafx the best website design company in San Diego (well, we had to say that).

Thank you,

James Byrne, Owner, Information Architect, USMC VET

Wordpress Design San Diego WooCommerce Developer San Diego

Worldwide Performance Parts – New Design & Migration from Magento 1.9 to WooCommerce

After Dark Grafx announces the re-launch of Store.WorldwidePerformance1.com   Off Road Performance Parts. Thank you for choosing After Dark Grafx to design and develop a new eCommerce website for you.

Worldwide Performance Parts contacted After Dark Grafx over 10 years ago to develop a new website for their business. We initially created a new eCommerce website for them using Magento 1.x at that time and migrated data from Miva Merchant to Magento.

Magento was the perfect solution for what this client wanted to do. Unfortunately,  migrating from Magento 1.9 to Magento 2.x is not an easy task. The developers of Magento fell short when it came to transitioning from their base platform into a newly recoded v2 platform without offering an easy to use migration utility to maintain their clients. Hence, the new website.

This client needed hundreds of options for products for their needs and Shopify and other solutions were not going to work out. We ended up designing and developing their new eCommerce wesbite in WordPress with WooCommerce as the shopping cart.

We were able to export Magento data, images, etc. and import them into WooCommerce with the help of 3 plugins. This was the largest hurdle but these plugins enabled us to easily port over all of their data from Magento 1.9x.

If you need to Migrate from Magento to WooCommerce and need some help, please contact us.

 

Wordpress Design San Diego WooCommerce Developer San Diego

 

After completing this website, we created several videos to help this client understand WooCommerce Ordering Process as well as How To Edit a Website with Elementor (WYSIWYG) editor.

 

“After Dark Grafx built another website for us. I wouldn’t go anywhere else. They just did everything. They asked me a few questions and the rest is history!” – Greg F.

Custom WordPress, WooCommerce Programming, WooCommerce Payments, Integrated Payment Gateways, Table / Price Based Shipping.

Their employees can login and place orders directly for their phone in customers or simply send them to the website to order.

Orders are tracked and the customer is notified as to the status of their order.

Visit them today at:
https://store.worldwideperformance1.com
and tell them James from After Dark Grafx sent you!

 

Do you want the Best Website Design in San Diego? Looking for the Best SEO Company in San Diego?

Contact us here!
Call Toll Free (888) 578-8300

App Development by After Dark Grafx for Spokane Beer Delivery - Liquor Store Delivery App

SpokaneBeerDelivery.com – App Development – Android – iOS

After Dark Grafx announces the launch of  SpokaneBeerDelivery.com new Mobile Apps available on both Android and iOS Devices.

Thank you for choosing After Dark Grafx to design and develop your new website and now your new mobile apps for your business.

Spokane Beer Delivery delivers more than just beer. They currently only deliver within 20 miles of their address and will soon be shipping nationwide.

 

Web Designers San Diego WooCommerce

Just pick the products you would like delivered, add them to your cart and checkout. They will then build your order, assign a driver and you will be enjoying your order before you know it. They only deliver within 20 miles of their store so be sure you live close by or you will be waiting a long time 🙂

After Dark Grafx actually created two mobile apps for Spokane Beer Delivery.  One is the retail liquor store delivery app for the customer and a second app for drivers who wish to drive and pickup orders at Spokane Beer Delivery.

 

Spokane Beer Delivery – RETAIL APP:

App Development by After Dark Grafx for Spokane Beer Delivery - Liquor Store Delivery App

Liquor Store Delivery App by After Dark Grafx for iOS for Spokane Beer Delivery Liquor Store Delivery App by After Dark Grafx for Android for Spokane Beer Delivery
Spokane Beer Delivery – DRIVERS APP:

Liquor Store Delivery App by After Dark Grafx for iOS for Spokane Beer Delivery Liquor Store Delivery App by After Dark Grafx for Android for Spokane Beer Delivery

 

Drivers can sign up within the app, get approved and start driving for the company. Orders appear on the drivers app screen and they can ACCEPT or DENY the order for delivery. The driver can change their status, contact the customer or store and has built in map with directions.

 

“James and his team were an integral part of our online development. They first created an eCommerce website for us. We immediately began getting sales. We then ask After Dark Grafx to create 2 mobile apps for us and the rest is history. These guys are great!” – T –

 

Visit them today at:
https://www.spokanebeerdelivery.com  
and tell them James from After Dark Grafx sent you!

Best Web Designers in San Diego - After Dark Grafx

TeeBagsMonthly.com – WooCommerce Developer San Diego Web Design

Jan 18, 2021 – by: James Byrne, Information Architect, USMC VET, After Dark Grafx

After Dark Grafx announces the launch of TeeBagsMonthly.com  T-Shirt Subscription Service. Thank you for choosing After Dark Grafx to design and develop your new eCommerce website.

Surfing, Skating, Snowboarding, Biking, and Diving have shaped our lives and the world that we live in. It is now time to give back to the sports that we love. Every month Tee Bags Monthly  sponsors small independent sports shops from around the world. They partner with them to create rad tee shirts, and mail them to their customers every month. Some of these shirts are iconic classic shirts that they sell in their shops and some are limited edition shirts that you can only get through tee bags monthly. We pump these shops on Social Media so they get a ton of free advertisement and a portion of each sale goes directly to the shop to help them cover monthly expenses.

Help support and promote the culture that you love, pick a bag option and sign up today.

 

Who designed Tee Bags Monthly - AfterDarkGrafx.com

 

Just pick a subscription or subscriptions and enjoy!

“After Dark Grafx built another website for me and it was a no-brainer to choose them again for this project. I have been designing and selling T-Shirts for years ( ewgprinting.com) and James and his team never fail to impress. I gave them what I wanted and they did the rest. Painless!” – D.H.

Custom WordPress, WooCommerce Programming, WooCommerce Subscriptions, Integrated Payment Gateways for subscription payments and auto recurring billing and integrated Stamps.com for shipping labels.

Their employees can login and place orders directly for their phone in customers or simply send them to the website to order.

Orders are tracked and the customer is notified as to the status of their order.

Visit them today at:
https://www.teebagsmonthly.com
and tell them James from After Dark Grafx sent you!

Or check them out on Facebook here:
https://www.facebook.com/teebagsmonthly/

 

Do you want the Best Website Design in San Diego? Looking for the Best SEO Company in San Diego?

Contact us here!
Call Toll Free (888) 578-8300

San Diego Wordpress Designer

HavenYardStructures.com – San Diego Website Design / WooCommerce Development

FOR IMMEDIATE RELEASE: After Dark Grafx announces the launch of HavenYardStructures.com  Thank you for choosing After Dark Grafx to design and develop your new WooCommerce website.

 

After completing a previous project, Haven Yards contracted After Dark Grafx to design and develop two additional websites for their business. HavenYardStructures.com is now online. Look for Haven Fencing later this year.

After Dark Grafx, a premiere San Diego Website Design Firm, designed and developed a fully functional eCommerce website to allow Haven Yard Structures the ability to sell their Pergola Kits and Custom Gazebos. They also offer virtual consultations so that you order exactly what you need.

Like many websites, their own outdated website fell prey to neglect because of the many demands of running a business. Realizing the need to represent themselves in a more professional way, they enlisted the professional website development services of After Dark Grafx.

 

Best WordPress Developer in San Diego

We were happy to provide our over 29 years of WordPress Development, Design and eCommerce experience to help Haven to realize its’ full potential. They can now easily send quotes or allow customers to order Pergola Kits or Gazebos directly from their website.” – James Byrne – Owner, USMC VET – After Dark Grafx

 

Website Designer San Diego - WordPress Woocommerce Haven Pergolas After Dark Grafx

Multiple Plugins Added and Custom WordPress and WooCommerce Programming to achieve the desired outcome. 

 

Visit them today at:
https://havenyardstructures.com/ 
and tell them James from After Dark Grafx sent you!

 

Need a New Website? E Commerce Store? App Developed? SEO Services? Contact us today! FREE QUOTE!

Categories

RECENT BLOG POSTS