รวมองค์ประกอบภาพของคุณเอง (วิดเจ็ต) (ตัวอย่างในวิดเจ็ตข้อมูลร้านค้า)

เมื่อวานฉันประสบปัญหาในการสร้างวิดเจ็ตจาก ข้อมูลร้าน ติดตั้ง พอร์ทัลการให้คะแนนสำหรับร้านค้าออนไลน์ ซึ่งเราใช้ผ่านทาง สมาคมพ่อค้า เพื่อให้สามารถใช้งานได้

น่าเสียดายที่ไม่มีปลั๊กอินสำหรับสิ่งนี้ผ่าน Shopware Store ดังนั้นจึงต้องวางรหัสด้วยตนเอง

ในการดำเนินการนี้ ขั้นแรก ฉันได้กำหนดค่าวิดเจ็ตข้อมูลร้านค้าในส่วนหลังของไซต์

หลังจากนั้นรหัสจะสามารถใช้ได้ลึกขึ้นเล็กน้อย

ในขั้นตอนถัดไป ฉันใส่รหัสนี้ในส่วนท้าย เริ่มโปรแกรม ftp ของคุณ (เช่น Filezilla) และมองหา:

/ธีม/ส่วนหน้า/ชื่อธีมของคุณ/ส่วนหน้า/ดัชนี

ณ จุดนี้ ฉันคิดว่าคุณกำลังใช้ธีมของคุณเองอยู่แล้ว มิฉะนั้น การเปลี่ยนแปลงของคุณจะไม่ได้รับการอัปเดตอย่างปลอดภัย มิฉะนั้น Shopware จะจัดเตรียมเอกสารนี้:

ทำการเปลี่ยนแปลงกับเทมเพลต

ฉันมักจะสร้างสำเนาสำรองของไฟล์ปัจจุบันก่อนทำการเปลี่ยนแปลง และเพิ่มวันที่ปัจจุบันลงในชื่อ

ใส่โค้ดด้านบนด้วยโปรแกรมแก้ไขข้อความ (เช่น Notepad++)

ตอนนี้วิดเจ็ตจะแสดงอยู่ที่ส่วนล่างของร้านค้าออนไลน์ Shopware ของคุณ แน่นอนว่ามันไม่ได้ดูดีขนาดนั้น ดังนั้น ข้อมูลร้านค้าจึงให้ข้อมูลโค้ดขนาดเล็กที่วางวิดเจ็ตนี้ไว้ที่ด้านล่างขวาอย่างแน่นหนา:

หน้าจอ @media เท่านั้น และ (ความกว้างต่ำสุด: 768px) { div#shopauskunft_widget { จอแสดงผล: บล็อก; ตำแหน่ง: คงที่; ขวา: 10px; ด้านล่าง: 10px; }}

แต่จะทำอย่างไรกับมัน?

สามารถระบุไฟล์ css เพิ่มเติมในแบ็กเอนด์ Showare ขั้นแรก ให้อัปโหลดไฟล์ css ใหม่ที่มีโค้ดด้านบนผ่าน ftp

ตอนนี้คุณต้องบอก Shopware 5 ว่าควรใช้ไฟล์นี้ เมื่อต้องการทำเช่นนี้ คุณไปที่ส่วนหลัง การตั้งค่า / ตัวจัดการธีม...

... เลือกธีมของคุณแล้วคลิกกำหนดค่าธีม

ภายใต้แท็บการกำหนดค่า...

… ป้อนไฟล์ css ของคุณภายใต้ “ไฟล์ CSS อื่นๆ”:

<link href="/th/themes/Frontend/ชื่อธีมของคุณ/frontend/_public/src/css/shopauskunft.css? template=itintime_170425&is_preview=on" media="all" rel="stylesheet" type="text/css" />

ตอนนี้ล้างแคชร้านค้าและรวบรวมธีม

และอื่น ๆ ... วิดเจ็ตของคุณดูดี! 🙂

ยังคงต้องใช้วิดเจ็ต RBA จากข้อมูลร้านค้าเพื่อส่งอีเมลประเมินผล ฉันจะแสดงวิธีตั้งค่าในโพสต์นี้:

ติดตั้งวิดเจ็ต RBA จากข้อมูลร้านค้าใน Shopware 5