#Neuigkeiten

Übersetzungen von Artikeln, meine Notizen und Beobachtungen

#RSCE: Title-Erstellung

2023-01-15 22:15 von Rashid Bairamov

Überschriften in Elementen und Sektionen sind eines der wichtigsten Elemente auf einer Website. Ein wichtiger Faktor bei der Erstellung von Überschriften ist die Möglichkeit, die Ebene der Überschrift von h1 bis h6 zu wählen. Manchmal ist es auch sinnvoll, die Überschriftenebene zu begrenzen, um die Seitenvalidierung und die SEO-Struktur nicht zu gefährden. Zum Beispiel nur h3- und h4-Überschriften oder h2 bis h6-Überschriften. Es gibt mehrere Möglichkeiten, Titel mit Rocksolid Custom Element zu erstellen.

1. Kopfzeile als StandardFields:

// rsce_dev_config.php
<?php

return array(
    'label' => array(
        'Titel',
    ),
    'types' => array('content'),
    'contentCategory' => 'RSCE: Inhalt',
    'beTemplate' => 'be_wildcard',
    'standardFields' => array( 'headline', 'cssID' ),
    'wrapper' => array(
        'type' => 'none',
    ),
    'fields' => array(
    		
    	),
    );

Um eine Überschrift hinzuzufügen, muss der Wert "headline" im Parameter "standardFields" angegeben werden.

Das Backend sieht dann wie folgt aus:

Um die Kopfzeile auf dem Frontend auszugeben, verwende ich den folgenden Code:

//rsce_dev.html5
<section class="rsce_dev <?= $this->class ?>" <?= $this->cssID ?>>
  <?php if( $this->headline ): ?>
    <<?php echo $this->hl ?> itemprop="title" class="rsce_dev__title">
      <?php echo $this->headline ?>
    </<?php echo $this->hl ?>>
  <?php endif; ?>
</section>

2. Kopfzeile für Mehrfachverwendung.

Der Nachteil der ersten Option ist, dass sie nur einmal verwendet werden kann. Manchmal ist es jedoch erforderlich, verschiedene Kopfzeilen mehrmals in einer Datei zu verwenden. Es kann sich zum Beispiel um eine Produktkarte handeln, bei der man für jeden einzelnen Position eine Kopfzeile hinzufügen muss. In diesem Fall ist die folgende Methode ideal.

// rsce_dev_config.php
'fields' => array(
    ### TITLE ###
    'title' => array(
      'label' => array(
        'de' => array('Überschrift', 'Hier können Sie die Überschrift hinzufügen'),
      ),
      'inputType' => 'inputUnit',
      'options' => array('h3', 'h4', 'h5', 'h6'),
      'eval' => array('tl_class' => 'w50 clr'),
    ),
  ),

Jeder Parameter kann zu inputUnit hinzugefügt werden. Dies kann ein einfaches p, span, div oder ein anderes Tag sein.

So sieht die Schlagzeile in Beckend aus:

Um die Kopfzeile auf dem Frontend auszugeben, verwende ich den folgenden Code:

// rsce_dev.html5
<?php if( $this->title): ?>
  <<?= $this -> title['unit'] ?> class="rsce_dev__subtitle">
    <?= $this -> title['value'] ?>
  </<?= $this -> title['unit'] ?>>
<?php endif; ?>

3. Feste Überschrift.

Während die früheren Methoden nur wenige oder gar keine Mängel aufwiesen, hat die neue Methode meiner Meinung nach nur Mängel. Diese Methode ist sehr geschlossen und erlaubt es nicht, die Überschriftenhierarchie von h1 bis h6 zu ändern, was die Validierung der Seite beeinträchtigen kann. Trotzdem soll auch diese Methode demonstriert werden.

// rsce_dev_config.php
### TITLE ###
'title' => array(
  'label' => array(
    'de' => array('Die Überschrift', '...'),
  ),
  'inputType' => 'text',
  'eval' => array('tl_class' => 'w50 clr'),
),

<?php if( $this->title): ?>
    <h1 class="rsce_dev__title">
      <?= $this->title ?>
    </h1>
<?php endif; ?>

Fazit:

Wir haben uns drei gängige Optionen für die Erstellung einer Überschrift mit Rocksolid Custom Element angesehen. Jede von ihnen hat bestimmte Vorteile, die für Ihre Arbeit nützlich sein können. Es spielt keine Rolle, wie die Überschrift umgesetzt wird, das Wichtigste ist, dass die Überschrift ihre Funktion erfüllt und die Suchmaschinenoptimierung nicht gefährdet.