Jangan Padam Post Ini.

Post ini digunakan untuk menguji keseluruhan tema MNS Store selepas sebarang perubahan CSS, Javascript atau template.

---

---

---

Block Paragraph (Drop Cap)

MNS Store dibangunkan dengan matlamat menghasilkan pengalaman membeli-belah yang pantas, kemas dan mesra pengguna. Artikel demo ini diwujudkan khas untuk menguji setiap elemen gutenberg, responsif desktop dan mudah alih, serta memastikan semua komponen dipaparkan dengan konsisten.

Artikel ini bukan sekadar kandungan contoh, tetapi berfungsi sebagai rujukan tetap setiap kali tema dikemas kini.

---

Block Heading 2

Mengapa artikel demo ini penting?

Setiap perubahan CSS berpotensi memberi kesan kepada komponen lain. Dengan adanya satu artikel demo yang lengkap, proses semakan menjadi lebih cepat dan sistematik.

Blok Heading 3

Tema yang baik bukan sahaja cantik pada desktop, malah perlu stabil pada telefon, tablet, dan pelbagai saiz skrin.

Blok Heading 4

Pastikan margin, padding dan tipografi kekal konsisten.

Blok Heading 5

Heading tahap lima digunakan untuk subtopik kecil.

Blok Heading 6

Heading tahap enam masih perlu jelas dibaca.

---

Blok Typography

Ini ialah perenggan biasa.

Ini ialan teks Bold.

Ini ialah teks Italic.

Ini ialah Bold+Italic.

Ini ialah Strikethrough.

Ini ialah Inline Code.

Ini ialah perkataan yang akan diuji menggunakan Highlight

Formula kimia: H₂O

Kuasa dua: x²

Lawati laman web rasmi MNS Store menggunakan satu pautan contoh.

---

Block Bullet List

• Item pertama
• Item kedua yang agak panjang supaya text wrapping dapat diuji pada desktop dan telefon .
• Item ketiga
  • Sub item pertama
  • Sub item kedua
    • Sub item ketiga

---

Block Numbered List

1. Langkah pertama.
2. Langkah kedua yang agak panjang supaya text wrapping dapat diuji.
3. Langkah ketiga.
   1. Sub langkah pertama.
   2. Sub langkah kedua.

---

Block Checklist

• [x] Typography
• [x] Lists
• [ ] Images
• [ ] Gallery
• [ ] Tables
• [ ] Code Block

---

Block Quote

Kualiti sesuatu tema WordPress bukan diukur pada rupa sahaja, tetapi pada konsistensi pengalaman pengguna di setiap peranti.

MNS Store Demo

---

Block Pullquote

Reka bentuk yang baik ialah reka bentuk yang hampir tidak disedari pengguna.

MNS Store

---

Block Image (Thumbnail)

Block Image (medium)

Block Image (Large)

Block Image (Full Size)

---

Ini adalah medium image Align Left. Teks atau perenggan panjang ini ditambah selepas gambar ini bertujuan untuk menguji teks wrapping di desktop dan juga telefon untuk memastikan ia betul-betul tepat dan cantik.

Teks atau perenggan panjang ini ditambah selepas gambar ini bertujuan untuk menguji teks wrapping di desktop dan juga telefon untuk memastikan ia betul-betul tepat dan cantik.

Ini adalah medium image Align Left. Teks atau perenggan panjang ini ditambah selepas gambar ini bertujuan untuk menguji teks wrapping di desktop dan juga telefon untuk memastikan ia betul-betul tepat dan cantik.

Ini adalah large image Align Left. Teks atau perenggan panjang ini ditambah selepas gambar ini bertujuan untuk menguji teks wrapping di desktop dan juga telefon untuk memastikan ia betul-betul tepat dan cantik.

Ini adalah large image Align Center. Teks atau perenggan panjang ini ditambah selepas gambar ini bertujuan untuk menguji teks wrapping di desktop dan juga telefon untuk memastikan ia betul-betul tepat dan cantik.

Block Gallery (2 Images)

Block Gallery 3 Images

Block Gallery 4 images

Gallery 6 images

Block Buttons

UJIAN RESPONSIF

• Semua gambar tidak overflow
• Caption berada di tengah
• Hover image berfungsi
• Gallery kekal kemas di desktop
• Gallery dua kolum pada telefon (jika berkaitan)
• Butang memenuhi lebar pada telefon
• Outline button masih jelas kelihatan

MNS Store Master Demo Post (Bahagian 3)

Bahagian ini memfokuskan kepada blok yang yang sering menyebabkan isu css dan responsif

Block Table (Jadual Ringkas)

Nama	Umur	Negeri
Ahmad	27	Terengganu
Siti	31	Kuala Lumpur
Farah	29	Pulau Pinang

Block Table (Jadual Lebar)

Produk	Harga	Berat	Warna	Stok	Waranti	SKU	Negara	Jenama	Status
Lampu LED	RM39.90	350g	Hitam	120	12 Bulan	LED001	Malaysia	MNS	Aktif
Power Bank	RM89.00	420g	Putih	56	6 Bulan	PB002	China	MNS	Aktif

Block Inline Code

Gunakan ‘display:flex', 'border-radius:16px', 'overflow-x:auto' dan 'object-fit:cover‘ di dalam satu perenggan

Block Code

<?php
function mns_demo_theme_test() {
    echo "Hello MNS Store!";
}

<?php

if (!defined('ABSPATH')) {
    exit;
}

require_once get_stylesheet_directory() . '/inc/setupgfgdggdgdgdgdgdggdgdgdgdgdggdgdgdggdhfhfdhhdhdhdhdhhdhdhdhdhhdhdhdhdhhdhdhdhhdhd.php;
require_once get_stylesheet_directory() . '/inc/setup/enqueue.php';
require_once get_stylesheet_directory() . '/inc/helpers.php';
require_once get_stylesheet_directory() . '/inc/helpers/home.php';
require_once get_stylesheet_directory() . '/inc/woocommerce/hooks.php';
require_once get_stylesheet_directory() . '/inc/helpers/collections.php';
require_once get_stylesheet_directory() . '/inc/helpers/category.php';
require_once get_stylesheet_directory() . '/inc/helpers/article.php';
require_once get_stylesheet_directory() . '/inc/ajax/search.php';

Block Preformatted

Ini ialah contoh preformatted
  Indent pertama
    Indent kedua
Spacing dan identation perlu dikekalkan.

Block Separator

---

---

---

---

Tiga jenis separator iaitu default, wide, dots. Semak jarak atas dan bawah setiap separator

Block File

Masukkan tiga file contoh

Semak ikon, nama fail dan butang muat turun

Block Audio

Semak Player dipaparkan dengan baik. Responsif pada telefon. Butang play berfungsi.

Block Video

Block Embed

@jorgitomidnight24

#residentevil4 #yanoloagarren #foryoupage #parati

♬ sonido original – Jorgitomidnight24

UJIAN TEKANAN

https://www.mnsstore.com/demo/ini-adalah-url-yang-sangat-panjang-atathsjkskfkosocmkdmckddkdfkdmfkdmfkdmkfmdkmfkdmfkdmkfmkdmfkdmfkmdkfmdkmfkdmfkdmkmfkdmfkdmfkdm

Ainannnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaasssssssssssssssssssssssssss

``` css
.this-is-a-very-long-css-selector-used-to-test-horizontal-scrolling-and-overflow-on-small-mobile-devices-without-breaking-the-layout-of-the-entire-article{display:flex;justify-content:center;align-items:center;border-radius:16px;overflow-x:auto;}
```

MNS Store – Master Demo Post (Bahagian 4)

Bahagian ini menguji blok susun atur (layout) gutenberg dan tingkah laku responsif pada pelbagai saiz skrin.

Block Columns (2 Kolum)

Untuk semakan, jarak antara kolum, susunan pada desktop, bertukar kepada satu kolum pada telefon, dan tiada overflow.

Block Column (3 Kolum)

Untuk semakan lebar setiap kolum, teks sejajar, dan responsif pada telefon

Blok Media & Text (Gambar kiri)

Blok Media & Text (Gambar Kanan)

Untuk semakan, lihat jarak antara gambar dan teks, mobile bertukar kepada satu kolum, dan dambar tidak overflow.

Blok Cover

Untuk semakan, overlay masih jelas, teks mudah dibaca, dan responsif.

Block Group

Block Row

Masukkan 3 butang dalam block row dan semak semua berada dalam satu baris dalam desktop, pecah dengan kemas pada telefon jika ruang tidak mencukupi

Block Stack

Semua dimasukkan dalam satu stack. Semak spacing menegak.

Blok Spacer

Spacer dimasukkan adalah 30 px

Spacer dimasukkan adalah 60 px

Spacer dimasukkan adalah 100 px

Pastikan jarak dipaparkan dengan betul.

Block Details

Tajuk: Soalan Lazim

Kandungan:

Ini ialah contoh kandungan detail block untuk menguji fungsi buka dan tutup (accordion).

Kandungan:
Ini ialah contoh kandungan detail block untuk menguji fungsi buka dan tutup (accordion)

Semak icon, animasi jika ada, responsif.

Block Social Icons

• Facebook
• WhatsApp
• YouTube
• WordPress

Semak saiz icon, hover, jarak antara icon

MNS Store Master Demo Post (Bahagian 5)

Bahagian terakhir ini digunakan sebagai Final Theme Certification Test sebelum tema dianggap stabil.

Block Classic Block

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Ini adalah paragraph. Classic Editor masih digunakan oleh sesetengah pengguna. Bahagian ini memastikan elemen HTML biasa seperti heading, paragraph, image, table dan list tidak terjejas oleh css gutenberg.

Ini adalah typography
Bold
Italic
Strikethrough
Pautan ke laman web contoh

Ini adalah bullet list

• Item pertama
• Item kedua
• Item ketiga
  • Item keempat
  • Item kelima
    • Item keenam
    • Item ketujuh

Ini adalah numbered list

1. Langkah pertama
2. Langkah kedua
3. Langkah ketiga
   1. Langkah keempat
   2. Langkah kelima
      1. Langkah keenam

Ini adalah blockquote

Ini adalah contoh petikan daripada Classic Editor

Produk	Harga	Berat	Warna	Stok	Waranti	SKU	Negara	Jenama	Status
Lampu LED	RM39.90	350g	Hitam	120	12 Bulan	LED001	Malaysia	MNS	Aktif
Power Bank	RM89.00	420g	Putih	56	6 Bulan	PB002	China	MNS	Aktif

 

Block custom html

html

Block shortcode

Block woocommerce shortcode

Semak grid produk, responsif, harga, butang Add to Cart

Edge Case

URL sangat panjang

https://www.mns-store.com/bloghsjdnswdmwdomeokdkeokeokdokedokeodkoekdoekdokdokdokdodkodkodkodkdokdodkodkdokdokdokdodkodkdokdokdodkdokdok

Perkataan sangat panjang

dnfjnefeifmsdmfierjitjerifjirjfijfierjifjrifjrifjsjhuwshuwhuehehehieoweiojwiojewjepwjpejweoiw3eoiweoiwioewijeiwjeowjeowjeowjeowjeojwoejwodwiejiweojwejwoejwojeow

Emoji

😁🤩💖

Pastikan emoji dipaparkan dengan baik

Bahasa

English paragraph

Perenggan Bahasa Melayu

中文测试。

日本語テスト。

العربية.

Semak font dan line height