> For the complete documentation index, see [llms.txt](https://docs.shoppego.my/tutorials/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.shoppego.my/tutorials/ms/online-store/menus/footer-menu.md).

# Footer Menu

Tutorial cara membina Footer Menu

Untuk membuat tetapan pada menu terdapat 2 langkah iaitu:-

1. Membina Page/Category

* Rujuk tutorial bina page di link berikut: [**Pages**](/tutorials/ms/online-store/custom-pages/build-pages.md)

{% content-ref url="/pages/AZHHE19c2eNhazdoo6jt" %}
[Build Pages](/tutorials/ms/online-store/custom-pages/build-pages.md)
{% endcontent-ref %}

* Rujuk tutorial bina category di link berikut: [**Categories**](/tutorials/ms/products/categories.md)

{% content-ref url="/pages/FlWoQnvQWUb86R9tQ2jA" %}
[Categories](/tutorials/ms/products/categories.md)
{% endcontent-ref %}

2. Mencipta menu kepada page/category.

Tutorial ini akan terus kepada langkah kedua. Sekiranya Page atau Categories masih lagi belum dicipta boleh ikuti tutorial seperti link di atas.

## Bahagian 1 : Mencipta Footer Menu

1. Log masuk ke dashboard dan pergi kepada **Online Store -> Menus.**\
   Paparan seperti di bawah akan keluar.

![](https://3359028955-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lh09fNwqqta5Vj6Wr8p%2Fuploads%2Fgit-blob-b403be258e218a8f4ccf2265c47cbf255964da98%2FcI9GzM1hEBHZyrz7nYJM.jpg?alt=media)

2. Klik pada butang **Add Menu.** Masukkan perkataan **Footer menu** pada ruangan **Title.**

{% hint style="info" %}
\*\*<mark style="color:red;">**Perhatian**</mark>: Pastikan **ejaan** dan huruf besar atau kecil adalah **sama**. seperti di dalam gambar di bawah.
{% endhint %}

3. Klik butang **Save**

![](https://3359028955-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lh09fNwqqta5Vj6Wr8p%2Fuploads%2Fgit-blob-243f16c4cd98943de97b34797f9ffc9ed2a22902%2F-MBcdzFCBzb3_vaXSyMT.png?alt=media)

4. Seterusnya footer menu yang bari dicipta sebentar tadi akan terpapar. Klik pada tab **Menu items**

![](https://3359028955-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lh09fNwqqta5Vj6Wr8p%2Fuploads%2Fgit-blob-bda2ccc74871f932b5786b83ac70be98beffe9c5%2F-MBce6AOBFJEmSExthze.png?alt=media)

5. Paparan selepas klik tab **Menu items**

![](https://3359028955-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lh09fNwqqta5Vj6Wr8p%2Fuploads%2Fgit-blob-c182f18133875683d6477592cd0f1ab596d88a5a%2F-MBceFjbERx4IZQzpoka.png?alt=media)

6. Seterusnya klik butang **Add menu item.** Pada ruang Title masukkan apa-apa nama yang melambangkan page anda.

Pada ruang link masukkan handle sahaja. Contoh adalah seperti dibawah.

* **Pages : /pages/nama-page-anda**
* **Categories : /categories/nama-category-anda**

{% hint style="info" %}
**\*\***<mark style="color:red;">**Perhatian**</mark>**:** Pastikan anda <mark style="color:red;">**tidak**</mark>**&#x20;meletakkan jarak** antara **/** dan **Nama page** anda. Perkara sama juga untuk **Categories**.
{% endhint %}

Sebagai contoh:

* **/pages/**<mark style="color:red;">**<->**</mark>**nama-page-anda** ❌
* **/pages/nama-page-anda** ✅

### 1 : Dapatkan Link bagi Pages

Terdapat **dua cara** untuk dapatkan link mengikut interface builder anda:

1. **Pages**: Pergi ke **Online store** -> **Pages**-> klik butang **Edit** pada **Nama page** dan copy **URL**.

![](https://3359028955-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lh09fNwqqta5Vj6Wr8p%2Fuploads%2Fgit-blob-00a8b8b2acfaa640300e124729be1c37f744991f%2F-MBcdI5yhwTji5x4SY_8.png?alt=media)

2. **Pages**: Pergi ke **Online store** -> **Pages**-> **Edit** -> **More** -> **Settings** -> **SEO** -> copy **URL**.

<figure><img src="https://3359028955-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lh09fNwqqta5Vj6Wr8p%2Fuploads%2Fgit-blob-9e8584323d68d8234d90d9fe4d20a9e81c36ea73%2FFDs5ZD3CvPoMGNgDv7Ep.jpg?alt=media" alt=""><figcaption></figcaption></figure>

### 2 : Dapatkan Link bagi Categories

**Categories**: Pergi ke **Products** -> **Categories** -> klik **Edit** pada **categories** -> klik tab **SEO** copy **URL.**

![](https://3359028955-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lh09fNwqqta5Vj6Wr8p%2Fuploads%2Fgit-blob-00c07462c265f97f990b4a4e8809265606c00559%2F-MBcdPKYpnsNmZYQF_v3.png?alt=media)

Paste kan URL tu pada ruangan Link. Contoh adalah seperti gambar di bawah.

{% hint style="info" %}
\*\*<mark style="color:red;">**Perhatian**</mark>: Sila pastikan <mark style="color:red;">**ejaan**</mark> pada **Link menu items** yang anda telah salin dari **SEO Page** dan **SEO Categories** adalah <mark style="color:red;">**sama**</mark>.
{% endhint %}

![](https://3359028955-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lh09fNwqqta5Vj6Wr8p%2Fuploads%2Fgit-blob-2daaefa1f92c910de60727a7fccaa93af071a181%2F-MBcevDddttNbTolGNJl.png?alt=media)

Klik butang **Add**.

Kini anda boleh cuba lihat pada homepage akan terpapar satu **footer menu** yang baru diciptakan sebentar tadi iaitu menu **New Arrival**

![](https://3359028955-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Lh09fNwqqta5Vj6Wr8p%2Fuploads%2Fgit-blob-7b81d3cb7dd5cd1edf625eb229b9ee1e5ea21b1b%2F-MBcf0sH3WIbmD-WamRc.png?alt=media)