メディアライブラリのalt情報がとれない時の対処法

先日Wordpressオリジナルテーマ化をしていたときのこと。

トップページのテンプレートでスライダーを設置していたので、管理画面「外観」からスライダー画像を切り替えられる設定にしました。

ところがalt属性が取得・反映できなくてだいぶ苦戦しました。

この記事ではwordpressテンプレート化の際に、メディアライブラリのデータを取得できなかった原因と対処した際のソースをのせます。

 

メディアライブラリの複製は元データと紐づける

alt属性に該当するのはメディアライブラリの「代替テキスト」。

メディアのalt入力欄

でも代替テキストに入力した文字列をaltに反映できない…

理由は画像の元データ(親)と複製データ(子)を紐付けてなかったから。

 

どういうことかというと、

まず「メディアライブラリ」にアップロードしたのが元画像Aだとする。

それを管理画面「外観」からスライダーに設置する過程で「範囲の切り取り」とか編集操作が挟まり、その時に画像の複製データA’が作られていたのです。

スライダーに表示されるのはA’。

A’に「代替テキスト」を入力しても、元データAのIDと紐づける命令を書いてないとダメと。

 

ちなみに上記の理解はこちらの記事からでした。

wordpressで画像はどのようにデータベースに記録されているか

もしwodpress内のツールを使って画像を編集した場合、デフォルトでは内部処理として画像は複製され、複製された方に編集が施されることになります。この処置によって未編集元画像が失われずいつでも復帰させることが可能となっています。

この「複製される」ということを最初全く知りませんでした。書いても書いても取得できなかったわけだ…

というわけで対応としては、alt取得うんぬんの命令前に、画像のURL(子)からID(親)を取得して紐づける。

今回書いたソース

$header_images = get_uploaded_header_images( );
if ($header_images) {
echo ‘<ul class=”bxslider”>’;
foreach ($header_images as $key => $value)
{
$img_id = fjarrett_get_attachment_id_by_url($value[‘url’]);
$img_meta = get_post();
$parent_id = $value[‘attachment_parent’];
$rink = esc_html($img_meta->post_content);
$alt = get_post_meta( $parent_id, “_wp_attachment_image_alt”,true);
echo ‘<li>’;
echo ‘<a href=”‘.$rink.'”>’;
echo ‘<img src=”‘.$value[‘url’].'” alt=”‘.$alt.'” />’;
echo ‘</a>’;
echo ‘</li>’;
}
echo ‘</ul>’;
}
else {
echo ‘<img id=”frontpage-image” src=”‘.get_template_directory_uri().’/img/xxxxx.jpg” width=”900″ height=”200″ />’;
}
?>

function.phpにfjarrett_get_attachment_id_by_url()

こちらのサイトさんより。

スライドするカスタムヘッダーに、リンクとキャプションを入れる方法

<?php
/**
* Return an ID of an attachment by searching the database with the file URL.
*
* First checks to see if the $url is pointing to a file that exists in
* the wp-content directory. If so, then we search the database for a
* partial match consisting of the remaining path AFTER the wp-content
* directory. Finally, if a match is found the attachment ID will be
* returned.
*
* @return {int} $attachment
*/
function fjarrett_get_attachment_id_by_url( $url ) {// Split the $url into two parts with the wp-content directory as the separator.
$parse_url = explode( parse_url( WP_CONTENT_URL, PHP_URL_PATH ), $url );// Get the host of the current site and the host of the $url, ignoring www.
$this_host = str_ireplace( ‘www.’, ”, parse_url( home_url(), PHP_URL_HOST ) );
$file_host = str_ireplace( ‘www.’, ”, parse_url( $url, PHP_URL_HOST ) );// Return nothing if there aren’t any $url parts or if the current host and $url host do not match.
if ( ! isset( $parse_url[1] ) || empty( $parse_url[1] ) || ( $this_host != $file_host ) ) {
return;
}// Now we’re going to quickly search the DB for any attachment GUID with a partial path match.
// Example: /uploads/2013/05/test-image.jpg
global $wpdb;$attachment = $wpdb->get_col( $wpdb->prepare( “SELECT ID FROM {$wpdb->prefix}posts WHERE guid RLIKE %s;”, $parse_url[1] ) );// Returns null if no attachment is found.
return $attachment[0];
}

コメント