fbpx
  • หน้าบ้าน
  • คอร์สเรียน
    • E-commerce
    • Line OA & MyShop
      • LINE Official Account Course
    • Facebook Ads
    • Google Ads
  • บทความ
  • TOP View
    • เวิร์ดเพรสส์ มือใหม่มากๆ
    • SEO Tool
    • LINE
    • Marketing Tool
  • WordPress
    • WordPress
    • Plugin
    • Theme
  • Software
    • Microsoft
      • Microsoft Office
    • Google
    • Adobe
  • Ads
    • Facebook
    • Line
    • YouTube
  • LIVE Style
No Result
View All Result
Zenkoy
  • หน้าบ้าน
  • คอร์สเรียน
    • E-commerce
    • Line OA & MyShop
      • LINE Official Account Course
    • Facebook Ads
    • Google Ads
  • บทความ
  • TOP View
    • เวิร์ดเพรสส์ มือใหม่มากๆ
    • SEO Tool
    • LINE
    • Marketing Tool
  • WordPress
    • WordPress
    • Plugin
    • Theme
  • Software
    • Microsoft
      • Microsoft Office
    • Google
    • Adobe
  • Ads
    • Facebook
    • Line
    • YouTube
  • LIVE Style
Zenkoy
  • หน้าบ้าน
  • คอร์สเรียน
    • E-commerce
    • Line OA & MyShop
      • LINE Official Account Course
    • Facebook Ads
    • Google Ads
  • บทความ
  • TOP View
    • เวิร์ดเพรสส์ มือใหม่มากๆ
    • SEO Tool
    • LINE
    • Marketing Tool
  • WordPress
    • WordPress
    • Plugin
    • Theme
  • Software
    • Microsoft
      • Microsoft Office
    • Google
    • Adobe
  • Ads
    • Facebook
    • Line
    • YouTube
  • LIVE Style
Zenkoy
No Result
View All Result
Hoverify – เครื่องมือสำหรับนักพัฒนาเว็บไซต์

Hoverify – เครื่องมือสำหรับนักพัฒนาเว็บไซต์

THEZEN by THEZEN
กันยายน 24, 2021
Reading Time: 2 mins read
0

Table of Contents

  1. รีวิวที่ดีนั้นควรมีราคา
  2. วิธีการติดตั้ง
  3. เว็บเบราว์เซอร์ที่รองรับ
  4. Manage license key
  5. วิธีการย้าย license key
  6. การตั้งค่า Hoverify
  7. ฟังก์ชั่นการใช้งาน Hoverify
    1. แสดงความเห็น

Hoverify – All-In-One Browser Extension For Web Development
Hoverify เป็นส่วนขยายของ Browser Extension เหมาะสำหรับ Web Development นักออกแบบเว็บไซต์ ด้วยเครื่องมือที่ให้มาทำให้เราสามารถเห็นภาพรวมทั้งเว็บ และแก้ไขเพื่อดูการแสดงผลได้ทันที

รีวิวที่ดีนั้นควรมีราคา

ทุกรีวิวของผมนั้นจะต้องมีราคาบอกไว้เสมอครับ

  1. ราคาหน้าเว็บขายเอง $30 แบบ Lifetime
    – All features
    – All updates for lifetime
    – License for 3 activations
  2. ขายผ่าน SaaS Marketplace อย่าง PitchGround
    Hoverify PitchGround Lifetime license
    Hoverify Plan A : $30 แบบ Lifetime
    = ได้ 1 User License
    Hoverify Plan B : $49 แบบ Lifetime
    = ได้ 3 User License
    Hoverify Plan C : $98 แบบ Lifetime
    = ได้ 10 User License
    Hoverify Plan D : $145 แบบ Lifetime
    = ได้ 25 User License
    Hoverify Plan D : $245 แบบ Lifetime
    = ได้ 50 User License

วิธีการติดตั้ง

  1. ติดตั้ง Browser Extension ส่วนขยายของ Chrome หรือ Firefox ก่อน
  2. กดที่ icon บน Extension จะขึ้นหน้า Login
  3. เข้าสู่ระบบ Login ด้วย license key + Email

เว็บเบราว์เซอร์ที่รองรับ

  • Google Chrome (โครม)
  • Mozilla Firefox (ไฟร์ฟอกซ์)
  • Microsoft Edge (เอดจ์)
  • Brave Browser (เบรฟ)

Manage license key

สำหรับใครที่ซื้อมาแล้ว จะมี Account ของตัวเองสำหรับจัดการ license key ได้ด้วยตนเอง ซึ่งสิ่งที่ทำได้ใน Account คือ

  1. เปลี่ยน Email Account (กรณีซื้อมากกว่า 1 license key )
  2. Assigned email address คือ เราสามารถแก้ไขเมล์ของตัวเองได้ว่า Key ไหนจะให้ใช้กับเมล์ไหน
  3. Activations คือ สามารถจัดการ Deactivate และ Change device name
    แต่ถ้าเรากด Deactivate ที่ตัว Browser Extension เมื่อ Login อีกครั้งก็จะให้ตั้งชื่อ Device name และ Activate เครื่องนั้นใหม่อยู่ดี เท่ากับว่าข้อ 3 ทำได้ผ่าน Browser Extension ได้เลย โดยไม่ต้องเข้าหน้า License Manager

วิธีการย้าย license key

ใบอนุญาต One license key นั้น สามารถ Activations ได้ 3 ที่พร้อมกัน

ตัวอย่างที่ 1
ใช้กับคอมที่บ้าน 1 เครื่อง ติดตั้ง Hoverify กับ…
1- Mozilla Firefox (ใช้ที่บ้าน)
2- Google Chrome (ใช้ที่บ้าน)
3- Microsoft Edge (ใช้ที่บ้าน)

ตัวอย่างที่ 2
ใช้กับคอมที่บ้าน + คอมที่บริษัท = 2 เครื่อง จะติดตั้ง Hoverify กับ…
1- Mozilla Firefox (ใช้ที่บ้าน)
2- Google Chrome (ใช้ที่บ้าน)
3- Google Chrome (ใช้ที่บริษัท)

การตั้งค่า Hoverify

เครื่องมือนี้พัฒนาขึ้นเพื่อ web developers มืออาชีพ ตอบโจทย์ปัญหาน่าปวดหัวรายวันที่ต้องเจอ
เมื่อติดตั้งและ Activations เสร็จแล้ว จะมีเมนูให้เห็นดังนี้ครับ

  1. Inspect : ตรวจสอบ html และ css โดยเพียงแค่วางเมาส์เหนือองค์ประกอบ
  2. Color Eyedropper : จิ้มเลือกสีที่ไหนก็ได้บนหน้าจอ ได้ทั้งรูปภาพและ iframes
    อารมณ์เหมือนเอาหลอดดูดสี ไปจิ้มเอาสีบนพื้นที่หน้าเว็บ ความพิเศษของ Hoverify มันเหมือนปืนเล็งเป้า จุดตัดตรงกาลางเส้น คือจุดที่มันจะจับว่าสี RGB คือสีอะไร แล้วมันก็จะปักหมุดจานสีไว้ตรงตำแหน่งนั้นๆค้างไว้  ฉะนั้นจิ้มไปให้ทั่วได้เลย เดี๋ยวค่อยมาเก็บ Code สี RGB ก็ได้ครับ
  3. Assets :  ดึงรูปภาพ svgs และวิดีโอจากหน้าอย่างรวดเร็ว
  4. Responsive : ดูตัวอย่างไซต์ใด ๆ บนหน้าจอหลายขนาดเคียงข้างกัน
  5. Debug : เครีย Clear Cacheตรวจสอบความถูกต้องของ Meta Tags, Links, Spellcheck
  6. Built with : รู้ว่าเว็บไซต์ใช้เทคโนโลยีใดในคลิกเดียว
  7. Take Screenshot : จับภาพหน้าจอของหน้าหรือทุกแท็บพร้อมกัน
    ในการจับภาพ Screenshot หน้าจอนั้นมีให้เลือกถึง 3 Option คือ
    – Capture Full Page : จับภาพทั้งหน้า ยาวลงมาถึงด้านล่างของเว็บ
    – Capture Visible Area : เลือกพื้นที่แคปหน้าจอด้วยตนเอง
    – Capture All Tabs : แคปหน้าจอทุกแถบที่เป็นอยู่ (จะไม่ Scroll bar ลงมานะครับ เท่าที่แสดงให้เห็นอยู่)

Trip เมื่อไม่ต้องการใช้ฟังก์ชั่นทั้ง 7 หัวข้อ  ให้กด ESC บนแป้นคีย์บอร์ดนะครับ จะเป็นการยกเลิก

 

ฟังก์ชั่นการใช้งาน Hoverify

มาถึงหัวข้อของรายละเอียดแต่ละฟังก์ชั่นของ Hoverify กันครับว่าทำอะไรได้บ้าง

  1. Inspector
    เจ้า Hoverify นั้นทำเรื่องต่างให้ง่ายเมื่อเราต้องการตรวจสอบไซต์ โดยเพียงแค่วางเมาส์เหนือองค์ประกอบบนเว็บไซต์ ก็จะแสดงรายละเอียดของ Element นั้นๆให้เราเห็น
  2. Color Eyedropper
  3. Assets
  4. Responsive Mode
  5. Built With
  6. Screenshots

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

ความเห็น

Previous Post

Best TikTok Feed Plugins For WordPress 2021

Next Post

QuestionScout สร้าง Forms และ surveys

THEZEN

THEZEN

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

Related Posts

Magic Link Auth เลิกจำรหัส Login ซะที!!
Wordpress

Magic Link Auth เลิกจำรหัส Login ซะที!!

มิถุนายน 27, 2022
0
Breakdance Visual Builder มาใหม่
Plugin

Breakdance Visual Builder มาใหม่

มิถุนายน 24, 2022
0
Review Divi Engine Divi Plugins
Plugin

Review Divi Engine Divi Plugins

มิถุนายน 5, 2022
0
Research

ตั้งชื่อ Domain อะไรดี ?

มิถุนายน 2, 2022
0
เลือก WordPress Theme ผิดชีวิตนี้ก็ไม่ติด SEO
Wordpress

เลือก WordPress Theme ผิดชีวิตนี้ก็ไม่ติด SEO

กรกฎาคม 1, 2022
0
Best Web Browser Engine 2022
Developer

Best Web Browser Engine 2022

พฤษภาคม 20, 2022
0
Next Post
QuestionScout สร้าง Forms และ surveys

QuestionScout สร้าง Forms และ surveys

  • 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
  • บทความ
  • TOP View
    • เวิร์ดเพรสส์ มือใหม่มากๆ
    • SEO Tool
    • LINE
    • Marketing Tool
  • WordPress
    • WordPress
    • Plugin
    • Theme
  • Software
    • Microsoft
      • Microsoft Office
    • Google
    • Adobe
  • Ads
    • Facebook
    • Line
    • YouTube
  • LIVE Style

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