ขั้นแรกให้เราสร้างไฟล์ .phtml ตั้งชื่อว่า thumb_pic.phtml แล้วนำอัพขึ้นไปที่ app/design/frontend/default/[ธีมที่ใช้งาน]/template/catalog/product/view/ โดยข้างในมีโค็ดดังนี้

<?php
$productId = $this->getProduct_id();
$_product = Mage::getModel('catalog/product')->load($productId); //load the product
?>
<img src="<? echo Mage::helper('catalog/image')->init($_product, 'thumbnail')->resize(75, 75); ?>" alt="<?php echo $this->htmlEscape($_product['name']); ?>" border="0" width="75" />

จากนั้นไปที่ CMS > Manage Pages ในที่นี้ผมจะเอารูปไปใช้ใน page นะครับ นำโค็ดด้านล่างไปใช้งาน

{{block type="catalog/product_new" product_id="2" template="catalog/product/view/thumb_pic.phtml"}}

โดยให้เราดูที่ product_id=”…” ให้นำ id ของสินค้ามาใส่

ตัวอย่างผมแก้จาก About Us

การแสดงผลออกมาจากตัวอย่างข้างต้น สามารถนำไปประยุกต์ใช้ได้นะครับ

เครดิต : http://www.molotovbliss.com/blog/magento-commerce/magento-display-a-product-image-within-static-pages-and-blocks/

โดยให้เราไปที่หน้า admin กันก่อนจากนั้นไปที่เมนู CMS > Static Blocks จากนั้นกดที่ Add New Block เพื่อสร้าง block ใหม่

ใส่รายละเอียดต่างๆลงไปแล้ว Save

1. Block Title : กำหนดชื่อ block ลงไป
2. Identifier : เป็นเหมือนไอดีของบล็อกครับซึ่งเราจะใช้ชื่อนี้ในการอ้างอิงดึงบล็อกนี้มาใช้งานกับส่วนต่างๆของเว็บ
3. Status : เลือก Enable เพื่อเปิดการใช้งาน
4. Content : ใส่รายละเอียดที่ต้องการลงไป เป็นโค็ด HTML ก็ได้ ในที่นี้ผมใส่คลิปวิดิโอ youtube ลงไป

*** ในส่วนของ Store View ถ้าใครลงภาษาเพิ่มก็จะสามารถกำหนดให้บล็อกนี้แสดงกับภาษาไหน

จากนั้นเราไปที่ CMS > Manage Pages เพื่อสร้าง page มา 1 หน้า

ใส่รายละเอียดลงไป

โดยในช่อง SEF URL Identifier จะเป็นการกำหนด URL ให้กับ page นี้ และในส่วนของ content ถ้าเราต้องการนำ block ที่เมื่อกี้เราสร้างไว้มาใช้งานกับหนน้านี้ ก็ให้เรานำโค็ดนี้ไปใส่ครับ

{{block type="cms/block" block_id="Identifier" template="cms/content.phtml"}}

ในส่วนของ block_id=”Identifier” ให้เราแก้คำ Identifier ไปเป็น Identifier ของบล็อกที่เราจะใช้งานเช่น video ซึ่งเหมือนตัวอย่างด้านบนที่ผมได้ทำการสร้างไว้ก็จะเป็น

{{block type="cms/block" block_id="video" template="cms/content.phtml"}}

เราก็จะได้หน้า page แบบนี้มาใช้งานครับ

ลองนำไปใช้งานกันดูนะครับ block ที่สร้างก็เอาใส่ข้อมูลพวกที่เราอาจจะต้องแก้ไขบ่อยๆ เราจะได้ไม่ต้องเข้าไปแก้ทั้ง page เราก็แก้เฉพาะ block โอกาสหน้าจะมาบอกการนำไปใช้งานกับตัว template กันเพื่อทำเป็น block ของ sidebar

ก่อนอื่นเลยให้ไปหน้า admin เข้าเมนู CMS > Manage Pages จะพบกับ page ที่ถูกสร้างมาแล้วให้เรากดที่ Add new page

ดูในส่วนของ General Information กันก่อน

1. Page Title เป็นหัวข้อของ page นี้
2. SEF URL Identifier เป็นการดำหนดชื่อ url ของ page นี้ครับ ดังตัวอย่างเวลาเรียก page โดยตรงก็จะเป็น domain.com/index.php/term
3. Status เลือก Enavle เพื่อเปิดการใช้งาน
4. Content ใส่รายละเอียดของหน้านี้ลงไปตามสะดวกเลยครับ อยากให้โชว์อะไรก็ใส่เข้าไป

ส่วน Store View จะเป็นการกำหนดว่านำ page นี้ไปใช้กับร้านค้าไหนของเรา ถ้าใครเพิ่มร้านค้าใหม่ขึ้นมาก็จะเจอครับ ส่วนของผมเป็นการทำร้านสองภาษาเลยมีให้เลือก

ต่อมา Custom Design เป็นการกำหนดรูปแบบการแสดงผลของ page นี้ครับหลักๆคงจะเป็น Layout ที่จะกำหนดว่าให้แสดงกี่ column

เสร็จแล้วทำการ Save ครับ

เราจะพบกับ page ที่เพิ่มเข้ามา

วิธีการนำไปใช้ก็สมมติผมจะสร้างเมนุของ page นี้ขึ้นมาที่เมนูหลักของเราก็ให้ไปที่ไฟล์ app/design/frontend/default/default/template/catalog/navigation/top.phtml จากนั้นนำโค็ดไปใส่ก่อน tag /ul

<li><a href="<?php echo $this->getUrl('term')?>"><?php echo $this->__('ข้อตกลง') ?></a></li>

โดยแก้ค่าใน getUrl(‘ ‘) ให้เป็นไปตามที่เรากำหนด SEF URL Identifier และ $this->__(‘ ‘) จะเป็นการแสดงผลคำนั้นๆออกมา เช่น

<div class="header-nav-container">
    <div class="header-nav">
        <h4 class="no-display"><?php echo $this->__('Category Navigation:') ?></h4>
        <ul id="nav">
        <?php foreach ($this->getStoreCategories() as $_category): ?>
            <?php echo $this->drawItem($_category) ?>
        <?php endforeach ?>
	<li><a href="<?php echo $this->getUrl('term')?>"><?php echo $this->__('ข้อตกลง') ?></a></li>
        </ul>
    </div>
    <?php echo $this->getChildHtml('topLeftLinks') ?>
</div>

จากนั้นดูผลกันครับ

ให้เราเข้าไปที่หน้า admin ของ prestashop จากนั้นไปที่เมนู Tools >> CMS จากนั้นกด เพิ่มใหม่

กรองรายละเอียดต่างๆให้ครบจากนั้นกด บันทึก

1. Meta title : ชื่อของ page นี้
2. Meta description : ใส่คำอธิบายสั้นๆของหน้านี้ เพื่อประโยชน์ต่อ SEO มันจะถูกนำไปแสดงใน meta tag
3. Meta keywords : ใส่ keyword เพื่อประโยชน์ต่อ SEO มันจะถูกนำไปแสดงใน meta tag
4. Friendly URL : ใส่คำที่จะให้มันแสดงผลเป็น url
5. เนื้อหา : ใส่เนื้อหาตามต้องการ

โดยในส่วนของ CMS นั้นจะสัมพันธ์กับ Module Info block เพื่อนำ page ต่างๆที่เราสร้างขึ้นมาไปแสดงที่หน้าแรกหรือ frontend ให้คลิกที่ตั้งค่า

เลือกหน้าที่ต้องการให้แสดงผลออกมา

การแสดงผล

ซึ่งหน้าตาก็จะคล้ายๆของการสร้างเนื้อหาโดยจะมีให้ใส่หัวข้อและรายละเอียด แต่เราจะใส่ออฟชั่นเสริมให้มันโดยดูที่ Menu settings เพื่อให้เพจที่เราสร้างขึ้นมามีเมนูไว้สำหรับลิงค์มายังเพจนี้

• Menu link title: ก็คือชื่อของ page link
• Parent item: ให้เลือกเป็น เนื่องจากใน drupal เมนูหลักเราจะเป็นตัวนี้ครับ
• Weight: เป็นการจัดเรียงเมนูโดย 0 เป็นค่าเริ่มแรก ถ้าสมมติมีหลายเมนู ถ้าเราไม่กำหนดมันจะจัดเรียงตามอักษรครับ

จากนั้นเลื่อนลงมาดูที่ค่า Publishing options โดยให้ติ้กเฉพาะ Published เพื่อเป็นการอนุญาตให้ใช้งานได้ก็พอแล้ว จากนั้นกด Save

เพียงเท่านี้เราก็จะได้เมนูขึ้นมาไว้สำหรับลิงค์ไปเพจที่เราสร้างขึ้นมา โดยตำแหน่งของ Primary link นั้นจะคิดอยู่กับ theme แต่ละตัวที่กำหนดมาว่ามันจะอยู่ในตำแหน่งไหน

เรามาดูวิธีทำกันดีกว่าครับว่าเขาทำกันได้ยังไง โดยให้เราเข้าไปที่หน้า admin ของ magento น่ะครับ จากนั้นไปที่ Catalog >> Manager Categories

อธิบายกันสักนิด โดยปกติระบบจะทำการสร้าง category มาให้ 1 อันชื่อ Default Category ซึ่งตัวนี้ล่ะครับถ้าต้องการให้เกิดเมนูบาร์ขึ้นมา เราต้องสร้าง sub category ของตัวนี้ครับ ไม่ว่าจะเป็นสินค้าหรือหน้าเพจไหนก็ตาม

**ไม่แนะนำให้สร้าง root category ขึ้นมาใหม่ ถ้าจะทำเกี่ยวกับ category ของสินค้าก็ให้สร้างเป็น sub category ภายใต้ Default Category ครับ เพื่อวันหลังเราอาจจะต้องการโชว์สินค้าตัวนี้ขึ้นมาที่เมนูบาร์จะได้ไม่ต้องมาสร้างใหม่**

เรามาดูในส่วนของการสร้างเมนูบาร์ให้ลิงค์ไปยังสินค้าของเรากันก่อนละกันครับ โดยให้สร้างเป็น Subcategory กดที่ปุ่ม Add Subcategory จากนั้นใส่รายละเอียดตาม วิธีเพิ่ม category ให้กับ magento นี้ครับ จากนั้นเรามาดูในหัวข้อ Is Active คือถ้าเราเลือก Yes แล้ว category ที่เราสร้างอยู่ใน sub ของ Default Category ก็จะเกิดเมนูบาร์สำหรับ category ตัวนี้แล้วครับ

จากนั้นมาดูที่แท็บ Display Setting ในส่วนนี้จะเป็นการแสดงผลของ category นี้ครับในหน้าเพจ

จากนั้นก็ให้เราสร้างสินค้า แล้วนำสินค้ามาใส่ลงใน category ที่เราสร้างขึ้นมาครับ เพียงเท่านี้หลังจากที่เรากดที่ เมนูบาร์ ก็จะลิงค์มายังสินค้าของเราแล้ว และถ้าเราสร้าง subcategory ภายใน category cpu อีกก็จะมีเมนูให้เลือกมาอีกครับ

Trick เล็กๆน้อยๆครับ สังเกตุ category ของผมไหมคือจะมีหมวดหมู่หลักคือ Computer และมี CPU กับ RAM เป็นหมวดหมู่ย่อย ทำไมหมวดหมู่ cpu ของผมถึงรู้ได้ว่ามี cpu และ ram เป็นหมวดหมู่ย่อยของมัน โดยมันจะถึง list สินค้าของ cpu และ ram มาเป็นสินค้าในตัวมันเองด้วย โดยให้เรากำหนดที่แท็บ Display Setting ในหัวข้อ Is Anchor ให้เลือกเป็น Yes ครับเพียงเท่านี้ computer ของผมไม่ว่า sub ของมันจะมีสินค้าชนิดไหน ตัวมันเองก็จะมีครับ

ประโยชน์ก็คือ เวลาเรากดที่เมนูบาร์ cpu มันจะแสดง list สินค้าที่อยู่ทั้งหมดใน cpu และ ram ออกมาแสดงครับ ดูได้ตามรูป

ต่อมาเรามาสร้างเมนูบาร์เพื่อลิงค์ไปยังหน้า page ปกตินะครับ ให้ไปที่เมนู CMS >> Static Blocks

กดปุ่ม Add New Block ที่มุมขวาบน

ใส่รายละเอียดลงไปครับ

1. Block Title ใส่ชื่อของ block ครับ ส่วนนี้จะทำการอ้่างอิงกับ category ผมตั้งว่า BlogContent
2. Identifier เป็นเหมือนรหัสของ block ที่เราสร้างขึ้นมาอะครับ
3. Status เลือก Enable เพื่อเปิดการใช้งาน
4. Content ในส่วนนี้จะเป็นการแสดงผลออกมาหน้า page น่ะครับสามารถใส่ code html ได้ตามต้องการ

ต่อมาเรามาสร้างเมนูบาร์เพื่อลิงค์ไปยังหน้า block ที่เราสร้างมาน่ะครับ ให้เราสร้าง subcategory ภายใต้ Default category เช่นเดิม ผมตั้งชื่อว่า Blog ล่ะกัน

ในส่วนของแท็บอื่นๆก็ตั้งค่าตามสบายครับเราจะมาดูในส่วนของแท็บ Display Setting กัน

1. Display Mode ให้เลือก Static block only เพื่อให้มันแสดงผลออกมาเฉพาะ block
2. CMS Block ให้เลือก block ที่เราสร้างมาเมื่อกี้ก็คือ BlogContent

จากนั้นทำการ save category ครับ เราก็จะได้มาแล้วครับสำหรับเมนูเพื่อลิงค์ไปยัง block ที่เราสร้างมา ในหน้านี้ผมไม่รู้จะใส่ไรลงไปผมเลยใส่ iframe แล้วลิงค์มายังหน้า killthewhat แทน ฮาๆหรือขี้เกียจนั่นเอง

ปล.ดูเว็บตัวอย่างได้ที่ http://killthewhat.com/magento/index.php/ หรือใครจะลองสมัครแล้วซื้อของก็ไม่ว่า โอนเงินมาด้วยน่ะครับ ^ ^ (แต่ไม่มีสินค้าให้น่ะ)

คลิกที่ Home page ครับ

จากนั้นทำการแก้ไขในส่วนของ Content ให้นำ code html ของเรามาใส่ลงไปครับ

พอหลังจากใส่ไปแล้วให้ทำการ save page

จากนั้นกดที่ Home

จากนั้นให้เราดูที่ Parameters (Advanced) ด้านขวามือ แล้วดูที่ Parameter Oder เลือกเป็น Oder เพื่อให้หน้าแรกเรียงแบบ Oder

จากนั้นไปที่เมนู Content > Article Manager

จากนั้นปรับ Oder ที่บทความเราให้เป็น เลขอะไรก็ได้ที่มันติดลบ อย่างเช่นผมใส่เลข -100 จากนั้นกดรูปแผ่นดิสที่ Oder เพื่อทำการ save

แค่นี้เละครับพอเราเขียนบทความหรือเนื้อหาใหม่ขึ้นมาก็จะไปต่อท้ายบทความที่เราปรับค่า Oder นั้นเสมอๆ

ตั้งชื่อ page จากนั้นไปที่ช่องเขียนเนื้อหาเพื่อทำการเขียน url ที่เราต้องการให้ redirect ไป ( ใส่ได้ 1 url เท่านั้น ) เช่น

http://snappy.nyte.net อันนี้ก็จะทำการลิงค์ไปยัง url ที่กล่าวมา
wp-admin/ อันนี้จะลิงค์เข้าสู่หน้า admin ของเว็บเรา
*** หมายเหตุ ถ้าลิงค์ภายในเว็บเราให้ทำการเขียน url ต่อท้ายจาก www.domain.com/ เลย โดยไม่ต้องใส่ www.domain.com นำหน้า ***

จากนั้นไปกดหนด Template ให้เป็น Page Redirect จากนั้น Publish เป็นอันเสร็จ

Thank : http://www.keyframesandcode.com/code/development/php/wordpress/wordpress-template-page-redirect/

จากนั้นดูว่าเราจะใส่ pagebreak ช่วงไหนให้กด pagebreak ที่ปุ่มด้านล่าง

pagebreak สามารถใส่ได้กี่ครั้งก็ได้ตามแต่เราจะแบ่งเนื้อหานี้ออกเป็นกี่หน้า