Tag: link

ข้อแตกต่างของ target แต่ละแบบ
ข้อแตกต่างของ target แต่ละแบบนั้น ถ้าเราอ่านเพียงแค่คำอธิบาย โดย
- _self แสดงผลในหน้าปัจจุบัน ปรกติทุก element จะมี target="_self" เป็นมาตรฐาน
- _parent แสดงผลในระดับบนถัดไปของหน้าปัจจุบัน
- _top แสดงผลในระดับบนสุดของหน้าปัจจุบัน
- _blank แสดงผลในหน้าใหม่
ก็ยังไม่ค่อยเข้าใจแน่ชัดเท่าไหร่ ผมเลยลองทำมาเป็นตัวอย่างให้ดูว่า ข้อแตกต่างของ target แต่ละแบบนั้น มันมีอะไรที่ต่างกันบ้าง โดยที่ผมสร้างไฟล์ขึ้นมา 4 ไฟล์ ประกอบด้วย
- index.html
- iframe-1.html
- iframe-2.html
- iframe-3.html
โดยที่ index.html นั้น จะมี <body> ดังนี้
```
<ul>
  <li>
    <a href="https://rabbitinblack.com" target="_self">_self Click</a>
  </li>
  <li>
    <a href="https://rabbitinblack.com" target="_parent">_parent Click</a>
  </li>
  <li>
    <a href="https://rabbitinblack.com" target="_top">_top Click</a>
  </li>
  <li>
    <a href="https://rabbitinblack.com" target="_blank">_blank Click</a>
  </li>
</ul>
```
หลังจากนั้นใน iframe-1.html จะมี iframe ที่เรียกใช้ index.html อยู่ ส่วน iframe-2.html จะเรียก iframe ที่มี iframe-1.html อยู่

และ iframe-3.html นั้นก็จะเรียก iframe ที่มี iframe-2.html อยู่ ซึ่งผลลัพธ์จะออกมาประมาณนี้

โดยผมใส่กรอบสีไว้ ให้แยกดูง่ายขึ้น

จากรูปนั้น ถ้าเราคลิกที่ _self Click ตัว iframe ใน Frame 1 จะเปลี่ยนเป็น URL ที่เรากำหนดไว้ในลิงก์

ถ้าเราคลิกที่ _parent Click ตัว iframe ใน Frame 2 จะเปลี่ยนเป็น URL ที่เรากำหนดไว้ในลิงก์

ถ้าเราคลิกที่ _top Click ตัวหน้าเพจนั้น จะเปลี่ยนเป็น URL ที่เรากำหนดไว้ในลิงก์

และถ้าเราคลิกที่ _blank Click จะมีการเปิดหน้าใหม่ตาม URL ที่เรากำหนดไว้ในลิงก์

หรือสามารถเปิดดูตัวอย่าง และลองคลิกลิงก์ได้เองที่

ตัวอย่างข้อแตกต่างของ target แต่ละแบบ

https://rabbitinblack.com/html/target/iframe-3.html

หวังว่าทุกคนจะเข้าใจวิธีการใช้งาน target ได้มากขึ้นนะครับ
February 21, 2022
วิธีใช้ WordPress ตอนที่ 10 – สร้างลิงก์

ในการเขียนบทความ หรือการทำเว็บของเรานั้น แน่นอนว่าเราต้องมีการเชื่อมต่อไปยังหน้าอื่น ๆ หรือเว็บอื่น ๆ บ้าง มาดูกันว่า เราสามารถสร้างลิงก์เพื่อใช้เชื่อมต่อกันอย่างไร

วิธีใช้ WordPress : สร้างลิงก์ในบทความ

ให้เราลากแถบเพื่อเลือกข้อความที่เราจะสร้างลิงก์ให้

หลังจากนั้นให้เลือก icon ที่รูปคล้าย ๆ โซ่ เพื่อที่เราจะสร้างลิงก์ให้ข้อความนั้น

กรอกข้อมูลต่าง ๆ ลงไป

โดย URL จะเป็นลิงก์ที่เราต้องการ และ Title จะเป็นข้อความที่ปรากฎตอนที่เรานำเม้าส์ไปวางไว้บนลิงก์นั้น

เรายังสามารถคลิ๊กที่คำว่า Or link to existing content เพื่อเลือกบทความในเว็บเราที่เราต้องจะลิงก์ไปถึง

ถ้าเราไม่ต้องการให้ข้อความนั้นเป็นลิงก์แล้ว เราสามารถคลิ๊กที่ icon รูปคล้าย ๆ โซ่แตก เพื่อจะลบลิงก์ของข้อความนั้นไป

ถ้าเรามองที่เมนูด้านซ้ายนั้น จะพบว่ามีเมนู Links มันมีไว้ทำอะไรมาดูกันครับ

วิธีใช้ WordPress : สร้างลิงก์

ลองมาสร้างกันดูนะครับ เลือก Add new เลยครับ

หลังจากนั้นก็กรอกข้อมูลต่าง ๆ

เราสามารถสร้าง Category เพื่อแบ่งประเภทของลิงก์ที่เราจะสร้างขึ้น

ยอมรับว่า ผมก็ยังไม่เข้าใจในส่วนของ Link Relationship เท่าไหร่เหมือนกันนะครับ แต่ถ้านำไปใช้คู่กับ jQuery น่าจะดีเหมือนกัน

และเมื่อเราสร้างเสร็จแล้ว มันจะไปปรากฎอยู่ที่ sidebar ของเว็บเราแบบนี้ครับ โดยชื่อ Category จะเป็นหัวข้อ และลิงก์ที่เราสร้างขึ้นเป็น List ดังตัวอย่าง

ตอนต่อไปครับ วิธีใช้ WordPress ตอนที่ 11 – WordPress Theme

December 31, 2011

Tag: link

ข้อแตกต่างของ target แต่ละแบบ

ตัวอย่างข้อแตกต่างของ target แต่ละแบบ

วิธีใช้ WordPress ตอนที่ 10 – สร้างลิงก์

วิธีใช้ WordPress : สร้างลิงก์ในบทความ

วิธีใช้ WordPress : สร้างลิงก์