Ändern Sie das Layout von Beiträgen mit geteilten Links so, dass sie zu Foto-/Videobeiträgen passen

Standardmäßig haben freigegebene Link-Posts ein anderes Layout als Foto- und Video-Posts, aber Sie können dies ändern, indem Sie den Anweisungen unten folgen.

Gehen Sie zunächst auf die Seite Post Layout des Plugins und wählen Sie Ihr Layout aus. Aktivieren Sie dann die folgende Einstellung: Anpassen > Verschiedenes > Medien > Gemeinsame Link-Bilder in voller Größe verwenden. Sobald diese Einstellung aktiviert ist, folgen Sie den Anweisungen unten für das von Ihnen gewählte Layout.

Thumbnail-Layout

Um das Layout so zu ändern, dass das Bild des gemeinsamen Links mit dem Layout der Miniaturansicht übereinstimmt, müssen Sie Folgendes tun:

1) Gehen Sie auf die Seite "Anpassen" des Plugins, klicken Sie auf die Registerkarte "Verschiedenes" und scrollen Sie nach unten zum Abschnitt " Benutzerdefiniertes CSS".
2) Kopieren Sie das Folgende und fügen Sie es in diesen Abschnitt ein:

#cff .cff-shared-link { width: 20%; margin: 0; background: none; border: none; }
#cff.cff-thumb-layout .cff-full-size .cff-link{ max-width: 100%; }
#cff.cff-thumb-layout .cff-link-item .cff-text-wrapper { width: 77%; }
#cff .cff-shared-link .cff-text-link{ display: none; }

3) Geben Sie in den darunter liegenden Abschnitt Custom JavaScript Folgendes ein:

$('.cff-item').each(function(){
  var $self = $(this),
    $textWrapper = $self.find('.cff-text-wrapper'),
    $sharedLink = $self.find('.cff-shared-link');
  $textWrapper.before( $self.find('.cff-shared-link') );
  if( $textWrapper.length < 1 ) $sharedLink.remove();
});

Layout mit halber Breite

Um das Layout weiter zu ändern, so dass sich das Linkbild links vom Beitragstext befindet, müssen Sie Folgendes tun:

1) Gehen Sie auf die Seite "Anpassen" des Plugins, klicken Sie auf die Registerkarte "Verschiedenes" und scrollen Sie nach unten zum Abschnitt " Benutzerdefiniertes CSS".
2) Kopieren Sie das Folgende und fügen Sie es in diesen Abschnitt ein:

#cff .cff-shared-link { width: 50%; margin: 0; background: none; border: none; }
#cff.cff-half-layout .cff-full-size .cff-link{ max-width: 100%; }
#cff.cff-half-layout .cff-link-item .cff-text-wrapper { width: 47%; }
#cff .cff-shared-link .cff-text-link{ display: none; }

3) Geben Sie in den darunter liegenden Abschnitt Custom JavaScript Folgendes ein:

$('.cff-item').each(function(){
  var $self = $(this),
    $textWrapper = $self.find('.cff-text-wrapper'),
    $sharedLink = $self.find('.cff-shared-link');
  $textWrapper.before( $self.find('.cff-shared-link') );
  if( $textWrapper.length < 1 ) $sharedLink.remove();
});
Unterstützung

Konnten Sie die Antwort nicht in den Dokumenten finden?

Kontakt zum Support

War dieser Artikel hilfreich?