fbpx
  • หน้าบ้าน
  • คอร์สเรียน
    • E-commerce
    • Line OA & MyShop
      • LINE Official Account Course
    • Facebook Ads
    • Google Ads
  • Ads
    • Facebook
    • Line
    • YouTube
  • TOP View
    • มือใหม่หัดเล่น WordPress
    • SEO Tool
    • LINE
    • Marketing Tool
  • WordPress
    • WordPress
    • Plugin
    • Theme
  • Software
    • Microsoft
      • Microsoft Office
    • Google
    • Adobe
  • LIVE Style
No Result
View All Result
Zenkoy
  • หน้าบ้าน
  • คอร์สเรียน
    • E-commerce
    • Line OA & MyShop
      • LINE Official Account Course
    • Facebook Ads
    • Google Ads
  • Ads
    • Facebook
    • Line
    • YouTube
  • TOP View
    • มือใหม่หัดเล่น WordPress
    • SEO Tool
    • LINE
    • Marketing Tool
  • WordPress
    • WordPress
    • Plugin
    • Theme
  • Software
    • Microsoft
      • Microsoft Office
    • Google
    • Adobe
  • LIVE Style
Zenkoy
  • หน้าบ้าน
  • คอร์สเรียน
    • E-commerce
    • Line OA & MyShop
      • LINE Official Account Course
    • Facebook Ads
    • Google Ads
  • Ads
    • Facebook
    • Line
    • YouTube
  • TOP View
    • มือใหม่หัดเล่น WordPress
    • SEO Tool
    • LINE
    • Marketing Tool
  • WordPress
    • WordPress
    • Plugin
    • Theme
  • Software
    • Microsoft
      • Microsoft Office
    • Google
    • Adobe
  • LIVE Style
Zenkoy
No Result
View All Result

Elementor Custom Break Points

THEZEN by THEZEN
สิงหาคม 31, 2021
Reading Time: 1 min read
0

Table of Contents

  1. Breakpoints คืออะไร?
  2. แล้วจะกำหนเ Break Points อย่างไร
  3. Elementor Custom Break Points
    1. แสดงความเห็น

Breakpoints คืออะไร?

ในการออกแบบเว็บไซต์ Responsive Web Design นั้นจะมีขนาดหน้าจอที่แสดงผล 3 ประเภท ด้วยกันเช่น Desktop, Tablet, Mobile แต่การออกแบบเว็บให้ปรับเปลี่ยนขนาดได้ตามอุปกรณ์ที่แสดงผลนั้น หากมีมือถือตัว Top หลายยี่ห้อ  เราก็คงต้องไปหาข้อมูลว่าขนาดหน้าจอเท่าไหร่  หรือแม้แต่ลูกค้าของเราใช้มือถืออะไร ถ้าทำแบบนี้คงปวดหัวตายแน่ๆ  กับการกำหนด Breakpoints จำนวนมาก เพื่อให้เว็บของเราแสดงผลในอุปกรณ์นั้นได้ดีที่สุด

สาระสำคัญของการสร้าง Breakpoints  ไม่ได้อยู่ที่ขนาดหน้าจอของ Devide ที่เปิดแสดงผล ยกตัวอย่างเช่น มีน้ำ 1 แก้ว หากเราเปลี่ยนขนาดแก้ว น้ำก็จะเปลี่ยนรูปทรงตามแก้วที่อยู่  แต่ถ้าเรานำน้ำไปฟรีชให้แข็ง เมื่อเราเทใส่แก้ที่ต่างกันน้ำแข็งก็จะไม่สามารถแนบชิดขอบแก้วได้  จะเห็นได้ว่าเราไม่จำเป็นต้องนำน้ำ ฟรีชให้แข็งในแก้วทุกขนาด เราแค่ต้องหากำหนดขนาดแก้วที่เทน้ำไปแล้ว น้ำนั้นไม่ล้นแก้ว ไม่ว่าจะแก้วขนาดใดก็ตาม

แล้วจะกำหนเ Break Points อย่างไร

หลักการออกแบบเว็บเราเน้นไปที่ Content เป็นหลักอยู่แล้ว เพราะคนสนใจเนื้อหา รูป ดังนั้นเนื้อหาเว็บ รูป ข้อความ ของเรามากคืดตัวกำหนด Break Points ให้เราไปเซตขนาด Devices ที่เว็บเราแสดงผลได้ดีที่สุด ที่เราต้องการไว้ 3- 4 ขนาด

Elementor Custom Break Points

สำหรับใครที่ใช้ Elementor  Pro จะมีเมนูให้สามารถเซต หรือเพิ่ม Break Points ได้ เพื่อให้ Content เราสามารถแสดงผลได้สวยงาม

 

 

 

 

แสดงความเห็น

ความเห็น

Previous Post

PhotoVibrance สร้างรูปภาพให้มีมิติ Motion Picture

Next Post

Qwary วัดความพึงพอใจของลูกค้า

THEZEN

THEZEN

ผู้ค้นพบความสุขในชีวิตได้ตลอดเวลา ทำตัวเองให้มีความสุกกับทุกสิ่งที่เข้ามาในชีวิต

Related Posts

Theme

Review Astra Theme Header Builder Menu

ธันวาคม 23, 2022
0
Review ProductX WooCommerce Builder
Lifetime Deal

Review ProductX WooCommerce Builder

ธันวาคม 22, 2022
0
Plugin

แก้ URLs ภาษาไทยใน wordpress ให้ยาวขึ้น

ธันวาคม 9, 2022
0
Live Copy Paste Elementor
Plugin

Live Copy Paste Elementor

พฤศจิกายน 25, 2022
0
รวม Email Marketing Platform 2022
Plugin

Email Marketing WordPress

ธันวาคม 17, 2022
0
review HappyMonster WordPress Plugin
Website

review HappyMonster WordPress Plugin

พฤศจิกายน 19, 2022
0
Next Post
Qwary วัดความพึงพอใจของลูกค้า

Qwary วัดความพึงพอใจของลูกค้า

  • Zenkoy คือใคร?
  • ห้องวิจัยส่วนตัว
  • My Future: My Life

© 2020 ผมชื่อเซน Blog เล็กๆของเด็กคอมคนนึง THEZEN . | เว็บนี้ใช้ธีม JNews

No Result
View All Result
  • หน้าบ้าน
  • คอร์สเรียน
    • E-commerce
    • Line OA & MyShop
      • LINE Official Account Course
    • Facebook Ads
    • Google Ads
  • Ads
    • Facebook
    • Line
    • YouTube
  • TOP View
    • มือใหม่หัดเล่น WordPress
    • SEO Tool
    • LINE
    • Marketing Tool
  • WordPress
    • WordPress
    • Plugin
    • Theme
  • Software
    • Microsoft
      • Microsoft Office
    • Google
    • Adobe
  • LIVE Style

© 2020 ผมชื่อเซน Blog เล็กๆของเด็กคอมคนนึง THEZEN . | เว็บนี้ใช้ธีม JNews

เราใช้คุกกี้เพื่อพัฒนาประสิทธิภาพ และประสบการณ์ที่ดีในการใช้เว็บไซต์ของคุณ คุณสามารถศึกษารายละเอียดได้ที่ นโยบายความเป็นส่วนตัว และสามารถจัดการความเป็นส่วนตัวเองได้ของคุณได้เองโดยคลิกที่ ตั้งค่า

ตั้งค่า ไม่ยอมรับ ยอมรับ
ตั้งค่าความเป็นส่วนตัว

คุณสามารถเลือกการตั้งค่าคุกกี้โดยเปิด/ปิด คุกกี้ในแต่ละประเภทได้ตามความต้องการ ยกเว้น คุกกี้ที่จำเป็น

ยอมรับทั้งหมด
จัดการความเป็นส่วนตัว
  • เปิดใช้งานตลอด

บันทึกการตั้งค่า
ตั้งค่าความเป็นส่วนตัว