Delaware theme

Guide to changing and customizing the Delaware theme.

Support-billede
By Morten Vadskær
more than 2 weeks ago
Approx. {eight} minutes

Guide on how to use the Delaware theme

General information

Menus in the footer

How to create a mega menu

Colors of menu, footer and more

Shipping and payment options logos in the footer

How to add/change value propositions

Blog and blog posts

Images in blog posts

There is room for three menus in your footer.

To place a menu in the footer, create a menu and give it one of the following three tags:

footer_menu_1

footer_menu_2

footer_menu_3

The name you give it will be the heading of the menu.

Images in blog posts

To insert images in a blog post, simply upload the images in the blog post and type:

[image index=1]

where you want the first image and

[image index=2]

where you want the next image etc.

To change the colors

Click Design -> Theme settings

Scroll down to"Theme and colors"

Insert the primary color or call to action color as hexadecimal values (including # in front).

If you scroll down to "Badges" just below, you will be able to change the colors of the badges that are placed on products.

Footer logos are set in theme settings (at the top).

In the Payment Methods Supported and Shipping Methods Supported fields, you can enter e.g. "dankort,visa" and see the Dankort logo and Visa logo.

If you are missing an option, please contact Morten Vadskær.


How to change / add value propositions to the page

You can add these value propositions to your front page and product page.

You can either click here or go to Design -> Theme Settings -> Value Propositions.

Here you have the option to write the headline, a short text, put an icon and a link to four different value propositions.

If you don't want a link, just leave it blank.

Below is a list of the icons you can use:

  • adjustment
  • adjustments
  • arrow-return
  • caret-right
  • chart-bar
  • check
  • chevron-down
  • chevron-left
  • chevron-right
  • chevron-down
  • cloud-arrow-down
  • cog
  • create
  • credit-card
  • document-check
  • document-text
  • eye
  • filter
  • flag-da
  • flag-en
  • flag-nb
  • flag-sv
  • heart-solid
  • heart
  • home
  • information
  • language
  • lifebuoy
  • loader
  • menu
  • minus
  • orders
  • pencil
  • play
  • plus
  • question-mark
  • search
  • shopping-bag
  • shopping-cart
  • sign-out
  • star-outline
  • star
  • storefront
  • test
  • trash
  • truck-loading
  • truck
  • wear
  • wrench
  • x

How to create the mega menu

First create the main menu of the mega menu

  1. Click on Navigation
  2. Click on Menus
  3. Click on "Create menu"
  4. For example, name it "Megamenu"
  5. Type "megamenu" under Tag
  6. Click "Save"

Create the submenus

Now you need to create the menus that will be in the mega menu.

  1. Click on Navigation
  2. Click on Menus
  3. Click "Create menu"
  4. Select the mega menu under "This menu is a submenu for"
  5. Then add the categories, landing pages etc. that you want in the menu
  6. If you want to show an image in the menu, type "show_image" in the "Possible html class" field
  7. Repeat step 5 until you have the submenus you want
  8. Click "Save"

Add your submenus to the mega menu

The submenus you created in the previous step should now be added to the mega menu.

  1. Click the pencil next to the mega menu
  2. Select "Menu" and click "Add"
  3. Now select the menu you created in the previous step.
  4. Repeat steps 2 and 3 until you have added all menus to the mega menu
  5. Click "Save"

Add your mega menu to the main menu

Finally, add your mega menu to the main menu.

  1. Click the pencil next to your main menu, which is probably called "Navigation" or something similar.
  2. Select "Menu" and click "Add"
  3. Now select your mega menu
  4. Click "Save"

You now have a mega menu in the theme.

See video with guide here

This website uses cookies.

We use cookies to personalize content and ads, provide social media features, and analyze our web traffic.

Information about your use of our website is also shared with our partners within social media, advertising, and analysis, who may combine them with other data from your interactions with their services.

Read more about our cookies