Dawn Theme: Change Quick Links Menu in Footer to dropdown menu on mobile

Store Design
1

Hi,

I’m using Dawn Theme and I want to make my Quick Links Menu in my Footer to dropdown menus for mobile view.

My website:

url: https://pure-dates.com/

pw: triwhi

This is my Website Mobile Footer
This is my Website Mobile Footer762×1414 30.4 KB

This is what I want it to look like
This is what I want it to look like990×506 19.1 KB

2

@Riz_bangee

It should be Done by the custom coding for that you have to hire a Developer.

Thank you.

3

@Riz_bangee
Use like this https://codepen.io/ranajitmane/pen/eBBBJE

4

@Zworthkey Thank you for forwarding me the coding template. I will customise it & let you know if it works for my Mobile

Accordian Footer Dropdown Menu

.footer_menu a {
  display: block;
  padding: 10px 15px;
}

.drop-down a {
  min-width: 90px;
}

.drop-down-menu {
  display: block;
}

.menu-title {
    display: block;
    padding: 10px 15px;
    background: #009688;
    color: #fff;
    cursor: pointer;
}

.activate {
  display: none;

  position: absolute;
  cursor: pointer;
  width: 100%;
  height: 40px;
  margin: 0 0 0 -15px;
  opacity: 0;
}

.drop-down a:hover {
  background: #111;
}

.drop-down {
  max-height: 0;
  overflow: hidden;
}

.drop-down a {
    background: #db52f3;
  color: #fff;
    text-decoration: none;
  text-transform: Capitalize;
}

.activate:checked ~ .drop-down {
  max-height: 200px;
}

.drop-down, .footer_menu a, .drop-down-menu {
  -webkit-transform: translateZ(0);  
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

i.ion-arrow-down-b {
    position: absolute;
    top: 8px;
    color: #fff;
    right: 14px;
    font-size: 1.5em;
}
5

Hii, @Riz_bangee

Welcome to the Shopify community!
Thanks for your good question.

This can be done through custom coding. If you want to make the footer menu customized . We will be happy to customize your theme for you.

Thanks

6

Looking for this too! Did it work?

Thank you for your time