ฉันกำลังทำงานกับธีมใหม่สำหรับการแจกจ่าย Rain (Drupal 9) แต่ฉันมีปัญหาในการแสดงแบรนด์ไซต์อย่างถูกต้อง นี่เป็นครั้งแรกที่ฉันพยายามสร้างธีม ดังนั้นขออภัยหากฉันถามโง่ๆ
Site_logo, site_name และ site_slogan จะแสดงอยู่ด้านบนของกันและกัน
นี่คือข้อความที่ตัดตอนมาจาก cloud_theme.theme:
/**
* ใช้ hook_preprocess_HOOK()
*/
ฟังก์ชัน cloud_theme_preprocess_block (อาร์เรย์ &$ตัวแปร) {
// ใช้ inline svg ในบล็อกการสร้างแบรนด์
ถ้า ($variables['plugin_id'] == 'system_branding_block') {
$variables['attributes']['class'][] = 'clearfix';
ถ้า (isset($variables['site_logo'])) {
$logo_path = DRUPAL_ROOT $ตัวแปร['site_logo'];
// หากโลโก้เป็น SVG ให้โหลดเนื้อหาเพื่อให้เราสามารถอินไลน์ได้
ถ้า (strlen($logo_path) - strpos($logo_path, '.svg') === 4) {
$variables['site_logo_svg'] = file_get_contents($logo_path);
}
}
}
}
นี่คือข้อความที่ตัดตอนมาจาก cloud_theme.libraries:
การสร้างแบรนด์เว็บไซต์:
css:
ส่วนประกอบ:
dist/css/site-branding.css: {}
นี่คือไฟล์ site-branding.css ของฉัน:
/**
* @ไฟล์
* รูปแบบภาพสำหรับบล็อกการสร้างตราสินค้าของไซต์ในธีม Cloud
*/
.site-โลโก้ {
จอแสดงผล: อินไลน์บล็อก;
ขอบขวา: 1em; /* LTR */
ขอบล่าง: 0.286em;
ขอบล่าง: 0;
}
[dir="rtl"] .site-logo {
ขอบขวา: 0;
ขอบซ้าย: 1em;
}
.site-ข้อความ {
จอแสดงผล: อินไลน์บล็อก;
จัดแนวตั้ง: ด้านบน;
}
@สื่อทั้งหมด และ (ความกว้างต่ำสุด: 461px) {
.site-ข้อความ {
ขอบล่าง: 1.857em;
}
}
@สื่อทั้งหมด และ (ความกว้างต่ำสุด: 901px) {
.site-ข้อความ {
ช่องว่างภายใน: 1.286em 0 0;
}
}
.site-ชื่อ {
สี: #686868;
ขนาดตัวอักษร: 1.6em;
ความสูงของบรรทัด: 1;
}
@สื่อทั้งหมด และ (ความกว้างต่ำสุด: 901px) {
.site-ชื่อ {
ขนาดตัวอักษร: 1.821em;
}
}
.site-สโลแกน {
ขอบด้านบน: 7px;
ระยะห่างระหว่างคำ: 0.1em;
ครอบครัวแบบอักษร: "Helvetica Neue", Helvetica, Arial, sans-serif;
ขนาดตัวอักษร: 0.929em;
รูปแบบตัวอักษร: ตัวเอียง;
}
นี่คือไฟล์ block--system-branding-block.html.twig ของฉัน:
{% ขยาย "block.html.twig" %}
{#
/**
* @ไฟล์
* การใช้ธีมของ Cloud สำหรับบล็อกการสร้างแบรนด์
*
* ตัวแปรองค์ประกอบการสร้างแบรนด์แต่ละรายการ (โลโก้ ชื่อ สโลแกน) จะใช้ได้ก็ต่อเมื่อ
* เปิดใช้งานในการกำหนดค่าบล็อก
*
* ตัวแปรที่มีอยู่:
* - site_logo: โลโก้สำหรับไซต์ตามที่กำหนดไว้ในการตั้งค่ารูปลักษณ์หรือธีม
* - site_name: ชื่อสำหรับไซต์ตามที่กำหนดไว้ในการตั้งค่าข้อมูลไซต์
* - site_slogan: สโลแกนสำหรับไซต์ตามที่กำหนดไว้ในการตั้งค่าข้อมูลไซต์
*/
#}
{% กำหนดแอตทริบิวต์ = attributes.addClass('site-branding') %}
{% บล็อกเนื้อหา %}
{% ถ้า site_logo %}
<a href="{{ เส้นทาง('<front>') }}" rel="home" class="site-logo">
<img src="{{ site_logo }}" alt="{{ 'หน้าแรก'|t }}" />
</a>
{% เอนดิฟ %}
{% ถ้าชื่อไซต์หรือสโลแกนของไซต์ %}
<div class="site-text">
{% ถ้า site_name %}
<div class="site-name">
<a href="{{ path('<front>') }}" title="{{ 'Home'|t }}" rel="home">{{ site_name }}</a>
</div>
{% เอนดิฟ %}
{% ถ้า site_slogan %}
<div class="site-slogan">{{ site_slogan }}</div>
{% เอนดิฟ %}
</div>
{% เอนดิฟ %}
{% บล็อกท้าย %}
ฉันไม่สามารถเข้าใจสิ่งที่ฉันขาดหายไป