แล้วการปรับแต่ง Live WordPress Theme แบบเรียลไทม์ล่ะ? CSSHero เป็นปลั๊กอินสำหรับทำการเปลี่ยนแปลงในวิธีที่ง่าย
เผยแพร่แล้ว: 2016-04-07WordPress เป็นเฟรมเวิร์ก CMS ที่เต็มไปด้วยการปรับแต่ง และมี API และ hooks มากมายที่นักพัฒนาสามารถใช้เพื่อแก้ไขธีมและปลั๊กอิน นั่นเป็นเหตุผลที่เรามีตัวเลือกให้เลือกปลั๊กอินจากปลั๊กอินที่มีอยู่นับพันจากที่เก็บอย่างเป็นทางการของ WordPress
ในโพสต์นี้เราจะพูดถึงปลั๊กอิน CSSHero
ใหม่พร้อมรายละเอียดทั้งหมด แต่ก่อนที่เราจะเริ่มต้น เรามาเน้นที่ these questions
กันก่อน
- จะ
make live changes
บนเว็บไซต์ WordPress ของคุณได้อย่างไร? - ธีมเปลี่ยนแบบเรียลไทม์?
- มีวิธีง่าย ๆ ในการทราบจำนวนคุณสมบัติ CSS สำหรับธีม WordPress หรือไม่?
- แก้ไขบล็อก WordPress ของคุณด้วยการแสดงตัวอย่างแบบเรียลไทม์
- ปรับแต่งธีม WordPress ก่อนเผยแพร่
หากคุณมีคำถามใด ๆ ข้างต้นแสดงว่าคุณมาถูกที่แล้ว
หากคุณต้องการทำการเปลี่ยนแปลงแบบสดด้วยตัวเอง without any help
จากปลั๊กอิน คุณจำเป็นต้องรู้ ~300 of CSS properties
ก่อนถึงมือ เป็นไปไม่ได้ที่จะแก้ไขสิ่งเหล่านั้นเพื่อดูการเปลี่ยนแปลงที่แท้จริงในโหมดธีมสด เครื่องมือ customizer
WordPress ช่วยให้คุณสามารถแก้ไขคุณสมบัติบางอย่างได้ แต่ไม่ใช่ทั้งหมด และนั่นคือปัญหาที่แท้จริงที่เรามี
ฉันจะบอกว่าเรามีสองตัวเลือก:
ตัวเลือกที่ 1) ทำการเปลี่ยนแปลง CSS ด้วยตนเอง
- เปิดบล็อกของคุณใน Chrome / Mozilla
- คลิกขวาที่องค์ประกอบ CSS เช่น ส่วนหัว โพสต์ รูปภาพ ฯลฯ
- คลิกที่
Inspect
เพื่อดูคุณสมบัติ CSS - ทำการเปลี่ยนแปลงเพื่อดูผล
- เมื่อคุณสบายดี – ไปที่
style.css
ของธีมแล้วบันทึกการเปลี่ยนแปลง - ทำซ้ำหลาย ๆ ครั้ง
ตัวเลือกที่ 2) ใช้ปลั๊กอินที่มีฟังก์ชันในตัว ในกรณีของเราคือ CSSHero
- ทำการเปลี่ยนแปลงบน
live site
ด้วยตัวแก้ไข - ดูผลสด
- คลิก
Save button
และคุณdone
CSSHero ร่วมกับ Crunchify มอบ
10 free Licenses
ให้กับผู้อ่าน Crunchify กรอกgoogle form นี้เพื่อรับรายชื่อของคุณ – แจก ENDED
มาติดตั้ง CSSHero และทำการเปลี่ยนแปลงธีม WordPress แบบสดกันเถอะ
NOTE
: ชำระเงินวิดีโอที่สมบูรณ์ที่ด้านล่างของโพสต์นี้
ขั้นตอนที่ 1
ทำไมต้อง CSSHero? CSSHero เป็นปลั๊กอิน WordPress premium
สิทธิ์ใช้งานพื้นฐานเริ่มต้นที่ $29/site
ฉันจะบอกว่า – หากคุณเป็นมือใหม่หรือมืออาชีพก็คุ้มค่าที่จะลอง มันมาพร้อมกับการรับประกันคืนเงิน 30 days
ใช้รหัส
CRUNCHIFY
เพื่อรับส่วนลด34% off
สำหรับ Starter, Personal Plans และ40% off
สำหรับแผน Pro
ลงทะเบียนใบอนุญาตของคุณและดาวน์โหลด CSSHero plugin
เวอร์ชันล่าสุดจากแดชบอร์ดของคุณ: http://www.csshero.org/
ขั้นตอนที่ 2
- ติดตั้งจากแผงผู้ดูแลระบบ WordPress ของคุณและเปิดใช้งาน
- เมื่อเปิดใช้งานจะขอ
Key
- เพียงคลิกที่
Get my Key Now!
ปุ่มและจะเปิดหน้าด้วยรหัสใบอนุญาต - คลิกที่รับ
Get License
และคุณพร้อมแล้ว
จุดที่-1) มาเริ่มใช้งานกันเลยดีกว่า
- ไปที่
home page
ของบล็อกแล้วคุณจะเห็นปุ่มเคลื่อนไหว CSSHero ที่มุมtop right
- คลิกที่นั้นและปลั๊กอินจะโหลด
control panel
ซึ่งใช้งานได้กับธีมของคุณ
ดู gif ด้านล่างพร้อม CSSHero options
ทั้งหมด:
จุดที่ 2) ตัวเลือกตัวแก้ไขธีม CSSHero
แนวคิดสำหรับ theme editor
คือการเปลี่ยน theme's style
ทั้งหมดด้วยโปรแกรมแก้ไขภาพอย่างง่าย ด้วยความช่วยเหลือของตัวแก้ไขธีม CSSHero คุณสามารถเปลี่ยนแปลงได้
- ข้อความส่วนหัว
- แบบอักษร
- ชายแดน
- สไตล์ ฯลฯ
เช่นเดียวกับ
- เนื้อหาในร่างกาย
- โพสต์รายการ
- ค่าเมตา
- ค่าส่วนหัว
- ส่วนท้าย
- แถบด้านข้าง ฯลฯ ลองดูที่ด้านล่าง GIF
จุดที่ 3) ตัวเลือกการจัดวางอุปกรณ์ที่มีประโยชน์เพียงคลิกเดียว
ดังที่คุณเห็นในภาพด้านล่าง ตัวแก้ไขธีมทำให้เรามีตัวเลือกในการชำระเงินสำหรับรูปแบบต่างๆ บนมือถือ, iPhone, iPad ของ Layouts
ของคุณด้วยการเลื่อนเมาส์และคลิกเพียงครั้งเดียว
จุดที่-4) จะเลิกทำการเปลี่ยนแปลงล่าสุดของคุณได้อย่างไร?
ผู้ใช้มีตัวเลือกในการเลิกทำการเปลี่ยนแปลงล่าสุดทั้งหมดโดยใช้โมดูล Change history
อย่างง่าย ฉันพนันได้เลยว่าไม่มีผู้พัฒนาคนใดทำสำเร็จในครั้งแรก อย่างน้อยฉันก็ :) มันมีประโยชน์มากสำหรับฉัน

CSSHero ยังมีโมดูลที่มีประโยชน์มากซึ่งจะแสดง all of your save changes
ทั้งหมด คุณสามารถย้อนกลับไปใน timeline
และเปลี่ยนกลับเป็นเวอร์ชันก่อนหน้าได้ นั่นไม่ใช่เครื่องมือที่มีประโยชน์เหรอ? ฉันใช้เครื่องมือนี้มาแล้วหลายครั้งและชอบมันมาก
จุดที่-5) ตัวเลือกการตั้งค่าและเครื่องมือ
Preset Settings
และ Tools Options
ดูวิดีโอโดยละเอียดที่เราได้รวบรวมไว้ซึ่งแสดงการทำงานทั้งหมดของ CSSHero
WordPress Custom CSS Editor
วิดีโอ Youtube โดยละเอียด:
เมื่อคุณได้เห็นฟังก์ชันการทำงานทั้งหมดแล้ว ก็ถึงเวลาถามคำถามด้านล่าง :)
จุดที่-6) ปลั๊กอินนี้ใช้งานได้กับธีมของฉันหรือไม่?
ตามข้อมูลจากเว็บไซต์ CSSHero อย่างเป็นทางการ ปลั๊กอินใช้งานได้กับเฟรมเวิร์กธีม WordPress ด้านล่างทั้งหมด
- กรอบปฐมกาล
- GeneratePress
- LayersWP
- ธีมสุดท้าย
- รวม
- ล่วงหน้า
- WP Bootstrap
- ใจความ
- จำเป็น+รองพื้น
- โอเมก้า
- เพจไลน์ DMS
หากธีมของคุณ isn't compatible
CSSHero ก็ no worries
มันจะแสดงตัวเลือกให้คุณเปิดใช้งาน Rocket mode
Message
: ไม่มีการสนับสนุนดั้งเดิมสำหรับธีมนี้ ต้องการลองการตรวจจับอัตโนมัติของ Rocket Mode หรือไม่? เพียง enable it
งานและลองแก้ไข CSS again
และคุณจะเห็นตัวเลือกเดียวกันกับที่คุณเห็นในวิดีโอด้านบน

จุดที่-7) การสนับสนุนปลั๊กอินและเอกสารประกอบเป็นอย่างไร?
ปลั๊กอิน WordPress ยอดนิยมบางตัว เช่น Gravity Forms, WooCommerce, Contact Form7, WP Pools และอื่นๆ เข้ากันได้กับเฟรมเวิร์ก CSSHero
นั่นหมายความว่า CSSHero ไม่เพียงแต่ทำงานร่วมกับ theme customization
เท่านั้น แต่ยังทำงานร่วมกับ plugin layout customization
อีกด้วย
สุดท้ายแต่ไม่ท้ายสุด ในเว็บไซต์อย่างเป็นทางการ มีบทความ tips and tricks
โดยละเอียดมากมายให้คุณอ่าน
Only Cons
ที่ฉันคิดได้คือทำความคุ้นเคยกับฟังก์ชันทั้งหมด อาจต้องใช้เวลาสักระยะในการเริ่มต้นและเป็นมืออาชีพ เมื่อคุณคุ้นเคยกับ CSSHero แล้ว ฉันแน่ใจว่ามันจะเป็น very handy solution
สำหรับบล็อกเกอร์ WordPress ทั้งหมด
ติดต่อเรา หากคุณมีผลิตภัณฑ์ ปลั๊กอิน ธีม ฯลฯ ที่คุณคิดว่าต้องการโปรโมต
นี่คือข้อเสนอสุดพิเศษสำหรับ CSSHero Crunchify:
สวัสดีผู้อ่าน Crunchify -
เรายินดีที่จะประกาศ up-to 40% off
สำหรับปลั๊กอินปรับแต่งธีม CSSHero WordPress
โปรดดูขั้นตอนด้านล่าง
ขั้นตอนที่ 1
- ไปที่ไซต์ CSSHero: https://www.csshero.org/
- คลิกที่ลิงค์
Pricing Plans
ขั้นตอนที่ 2
- คลิกที่ปุ่ม
I have a coupon code
ขั้นตอนที่ 3
- ใส่รหัสคูปอง:
CRUNCHIFY
ขั้นตอนที่ 4
- คลิกที่ปุ่มแลกรับส่วนลด
34% off
สำหรับ Starter และ Personal Plan - รับส่วนลด
40% off
สำหรับแผน Pro
รายการดีลทั้งหมด: https://crunchify.com/deals/