คู่มือการใช้งานเบื้องต้น icon สวยๆ : คลังไอคอนธรรมะและทางโลก
เรียนรู้เกี่ยวกับเว็บได้นี่ web.dev วิธีใช้งานคลังไอคอนใน Blogger 1. ทำไมต้องใส่โค้ดใน <head> ก่อน Blogger เองไม่มีไอคอนติดมาให้ เราต้องโหลดไลบรารีไอคอน เช่น
Font Awesome ,
Material Icons , และ
Boxicons ถ้าไม่ใส่โค้ดนี้ ไอคอนจะไม่แสดงผล จะเห็นเป็นสี่เหลี่ยมว่าง ๆ 2. โค้ดที่ต้องใส่ใน <head> ให้เข้าไปที่
ธีม (Theme) →
แก้ไข HTML (Edit HTML) → ค้นหาส่วน <head> แล้ววางโค้ดนี้ลงไป: html <head>
<!-- โหลดไอคอนที่จำเป็น -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"/>
<link href="https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css" rel="stylesheet"/>
</head>
3. โค้ดตัวอย่างสำหรับโพสต์ Blogger เมื่อเตรียม <head> เสร็จแล้ว คุณสามารถนำโค้ดนี้ไปวางในเนื้อหาโพสต์ เพื่อแสดงไอคอนพร้อมปุ่ม Copy: html <div class="icon-section"&g…