WordPressのテーマRestaurateurのスライダーにリンクを貼りたい。

RestaurateurというWordPressのテーマに付いている機能を使って、スライダーを表示させています。
スライダーに入れた画像から固定ページにリンクを貼りたいのですが、下記のように記載してもリンクが貼れません。
詳しい方、教えていただけると幸いです。

takutok

2015/06/05 02:31

書き換えた部分が、img 外側のaタグとpタグだけであれば、それで問題無いはずです。 <div id="slide-wrap">　の中身を全て張り付けていただけますか？

行動規範の内容に同意します

回答1件

ベストアンサー

まことに残念ながら、「Restaurateur」のスライダーにはリンクを付与する機能はなかったかと存じます。

スライダー付きテンプレート選択→画像を配置→「自動的に」スライドショーとして整形表示

この「自動的」の箇所で画像だけが抜き取られます。処理はalt-homepage.phpです。

リンクを付与するとすれば…

①「Restaurateur」のスライダーをあきらめて、別のスライダープラグインを用いる

②「Restaurateur」をカスタマイズする

となるかと存じます。

②の場合、少しややこしいですが、全ての画像にリンクがあるとすれば、手法の一つとして以下で実現可能かと存じます。
テーマファイルも修正しますので、何かあれば元に戻せるように願います。

テーマファイルのalt-homepage.phpを編集
→画像にonclik（クリックされた時の処理）を追加
72行目あたりを修正

lang
1（修正前）
2$attachments = get_posts( $args );
3 if ( $attachments ) {
4	foreach ( $attachments as $attachment ) { ?>
5    <div class="slides">
6      <div id="post-<?php the_ID(); ?>" <?php post_class('post-theme'); ?>>
7    	<div class="slide-thumb"><?php echo wp_get_attachment_image( $attachment->ID, array( 1000, 640 ), false, '' ); ?></div>
8	   						
9      </div>
10    </div>
11 ↓
12（修正後）
13$attachments = get_posts( $args );
14 if ( $attachments ) {
15	$count=0;
16	foreach ( $attachments as $attachment ) {  //修正箇所
17    $count++;  //追加箇所
18    $addClick = array("onclick"=>"linkOpen($count)","style"=>"cursor:pointer");  //追加箇所
19     ?>  //追加箇所
20    <div class="slides">
21      <div id="post-<?php the_ID(); ?>" <?php post_class('post-theme'); ?>>
22    	<div class="slide-thumb"><?php echo wp_get_attachment_image( $attachment->ID, array( 1000, 640 ), false, $addClick ); ?></div>  //修正箇所
23	   						
24      </div>
25    </div>

続いてスライダーを用いている固定ページを編集
→クリックされた時の呼び出される処理をjavascriptで追加
※テキストモードで記事の末尾にでも直接記述ください（空改行など、間に挟まないように願います）

lang
1<script>// <![CDATA[
2function linkOpen(targetNo) {
3  switch(targetNo) {
4    case 1://1枚目の画像がクリックされた時
5          window.location.href ='遷移先URL';
6           break;
7    case 2://2枚目の画像がクリックされた時
8           window.location.href ='遷移先URL';
9           break;
10    case 3://3枚目の画像がクリックされた時
11           window.location.href ='遷移先URL';
12           break;
13    case 4://4枚目の画像がクリックされた時
14           window.location.href ='遷移先URL';
15           break;
16    case 5://5枚目の画像がクリックされた時
17           window.location.href ='遷移先URL';
18           break;
19  }
20}
21// ]]></script>