Trick # 240 | Dieser Beitrag beinhaltet 526 Wörter. – Geschätzte Lesezeit: ca. 3 Minuten.
Im Bild-Modul des Divi-Themes lassen sich ALT-Texte, welche etwa das abgebildete Bild in Worten beschreiben, problemlos erfassen. Ebenso die Title-Tags. Wer aber – und das tun sicher viele – Bilder direkt aus der Mediathek übernimmt, wird bald feststellen: Weder die ALT-Tags noch die Title-Tags werden in Divi angezeigt. Das lässt sich aber nachbessern und wir zeigen Ihnen, wie das geht.
Um Divi das Auslesen der ALT-Tags und zugleich das Übernehmen der Title-Tags auch aus der Mediathek beizubringen, benötigen Sie einen zusätzlichen Code in der functions.php, der unten zu sehen ist. Fügen sie diesen via Design/Theme-Editor in die Datei functions-php Ihrer Website ein:
function get_image_meta( $image, $type = 'alt' ) {
if ( ! $image ) {
return '';
}
$output = '';
if ( '/' === $image[0] ) {
$post_id = attachment_url_to_postid( home_url() . $image );
} else {
$post_id = attachment_url_to_postid( $image );
}
if ( $post_id && 'title' === $type ) {
$output = get_post( $post_id )->post_title;
}
if ( $post_id && 'alt' === $type ) {
$output = get_post_meta( $post_id, '_wp_attachment_image_alt', true );
}
return $output;
}
/* Aktualisiert image alt text in Modulen */
function update_module_alt_text( $attrs, $unprocessed_attrs, $slug ) {
if ( ( $slug === 'et_pb_image' || $slug === 'et_pb_fullwidth_image' ) && '' === $attrs['alt'] ) {
$attrs['alt'] = get_image_meta( $attrs['src'] );
$attrs['title_text'] = get_image_meta( $attrs['src'], 'title' );
} elseif ( $slug === 'et_pb_blurb' && 'off' === $attrs['use_icon'] && '' === $attrs['alt'] ) {
$attrs['alt'] = get_image_meta( $attrs['image'] );
} elseif ( $slug === 'et_pb_slide' && '' !== $attrs['image'] && '' === $attrs['image_alt'] ) {
$attrs['image_alt'] = get_image_meta( $attrs['image'] );
} elseif ( $slug === 'et_pb_fullwidth_header' ) {
if ( '' !== $attrs['logo_image_url'] && '' === $attrs['logo_alt_text'] ) {
$attrs['logo_alt_text'] = get_image_meta( $attrs['logo_image_url'] );
}
if ( '' !== $attrs['header_image_url'] && '' === $attrs['image_alt_text'] ) {
$attrs['image_alt_text'] = get_image_meta( $attrs['header_image_url'] );
}
}
return $attrs;
}
/* Filter injection */
add_filter( 'et_pb_module_shortcode_attributes', 'update_module_alt_text', 20, 3 );Nun werden auch die ALT- und Title-Tags aus der Mediathek im HMTL-Konstrukt der Webseite ausgegeben.
Werbung
Werbung
