Trick # 42 | Dieser Beitrag beinhaltet 482 Wörter. – Geschätzte Lesezeit: ca. 3 Minuten.
Beitragsbilder erscheinen im Divi-Theme am Seitenkopf und lassen sich von Haus aus nicht per Klick vergrössert anzeigen. Vielleicht möchten Sie dies aber gerne. Dafür haben wir hier einen Trick parat.
Fügen Sie folgenden Code in die functions.php Ihrer Website ein. Sie finden die Datei unter Design/Theme-Editor:
add_action('wp_footer', 'open_featured_image_in_lightbox');
add_filter('et_pb_index_blog_image_width', 'set_featured_image_max_width');
add_filter('et_pb_index_blog_image_height', 'set_featured_image_max_height');if (!function_exists('open_featured_image_in_lightbox')) {
function open_featured_image_in_lightbox() {
?>
<script>
jQuery(function($){
$featured_img = $('body.single article.post .et_post_meta_wrapper > img');
$featured_img.wrap('<a class="et_pb_lightbox_image"></a>');
$featured_img.each(function(){
$(this).parent().attr('href', $(this).attr('src'));
});
});
</script>
<?php
}
}if (!function_exists('set_featured_image_max_width')) {
function set_featured_image_max_width($width) {
return max($width, 9999);
}
}if (!function_exists('set_featured_image_max_height')) {
function set_featured_image_max_height($height) {
return max($height, 9999);
}
}Damit werden Beitragsbilder auf Postseiten verlinkt und beim Anklicken in voller Pracht in der Lightbox angezeigt.
Werbung
Vor Wochenfrist haben wir einen Beitrag zum Blurb-Modul des Divi-Themes veröffentlicht, in dessen Folge zahlreiche Anfragen für besondere Stylings eingetroffen sind. Darum schieben wir heute eine Serie Stylingideen zum Informationstext-Modul ...
In unserer kleinen «Call-To-Action»-Reihe haben wir eine weitere Gestaltungsidee: Den diagonal abgeschrägten Button, der beim Hovern gerade Kanten erhält. Ist ganz einfach zu machen.
Das Blog-Modul des Divi-Themes kann schon vieles - die Beitragsbilder lassen sich aber nur bedingt steuern. Versehen Sie die Beitragsbilder mit einem Rotations- und Zoom-Effekt, der aktiv wird, sobald Sie die Maus über das Bild bewegen.
Lust auf die etwas anderen Farben? Mit diesem kurzen Snippet können Sie die Farbe der Cursor-Hervorhebung auf Ihrer Divi-Website nach Belieben ändern.
Keine Inhalte gefunden.


