แล้วการปรับแต่ง Live WordPress Theme แบบเรียลไทม์ล่ะ? CSSHero เป็นปลั๊กอินสำหรับทำการเปลี่ยนแปลงในวิธีที่ง่าย
เผยแพร่แล้ว: 2016-04-07
WordPress เป็นเฟรมเวิร์ก 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/
