Wordpressでテンプレート毎に一部表示を切り替える方法は？
- FC2ブログからWordpressに乗り換えた方にとって、テンプレート毎に一部表示を切り替える方法は重要なことです。
- FC2ブログではブロック変数を使用してインデックスやパーマネントエリアごとに表示・非表示を切り替えていましたが、Wordpressではどのようにすれば同じことができるのでしょうか？
- 例えば、vicunaテンプレートではサイドバーが独立しているため、特定の部分を非表示にするためにはどうすれば良いのか知りたいです。
- ベストアンサー
wordpress テンプレート毎に一部表示を切り替える方法は？
最近、FC2ブログからWordpressに乗り換えました。 テンプレートは、vicunaのninjaを使用しています。 FC2ブログのほうでは、 <!--index_area-->～<!--/index_area--> <!--not_index_area-->～<!--/not_index_area--> <!--permanent_area-->～<!--/permanent_area--> <!--not_permanent_area-->～<!--/not_permanent_area--> というブロック変数が用意されていて、 この変数に囲まれた部分を、インデックスやパーマネントエリアごとに、表示・非表示を切り替えることができました。 Wordpressでは、どうすればこれと同じことができるのでしょうか？ 例えば、vicunaでは、サイドバーがsidebar.phpとして独立しています。 ここで、 <dl> <dt> side_title(1) </dt> <dd> content </dd> <dt> side_title(2) </dt> <dd> content </dd> <dt> side_title(3) </dt> <dd> content </dd> </dl> というふうにサイドバーが構成されていたとして、中央の <dt> side_title(2) </dt> <dd> content </dd> の部分だけを、インデックスエリア(index.php)で非表示にするためには どうすればいいのでしょうか？
- ブログ
- 回答数1
- ありがとう数3
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
例としてindex.phpをtop.phpに名前を変更してtop.phpの中にsaidebar.phpを組み込んでsaidebarの部分を編集するのが手っ取り早いんじゃないですか。 このテンプレートが必要なページの部分でwpの「ページテンプレート」で選択すればOKです。 このようにすればいろんな種類のページテンプレートを簡単に作成できると思います。 ただしこのtop.phpを保存するときに、このファイルのテンプレート名を変更しておいてください。 例をあげると <?php /* Template Name: Toppage */ のようにです。
関連するQ&A
- 記事のソースとは？
ＦＣ２ブログを使ってるんですけど「記事のソース」とは具体的にはＨＴＭＬだとどのあたりのことをいうのでしょうか？ このあたりにあるでしょうか？ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta name="robots" content="index,follow" /> <meta http-equiv="Content-Type" content="text/html; charset=euc-jp" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <!--index_area--><title><%blog_name></title><!--/index_area--> <!--titlelist_area--><title><%blog_name> （全記事一覧）</title><!--/titlelist_area--> <!--permanent_area--><title><%sub_title> 【 <%blog_name> 】</title><!--/permanent_area--> <!--edit_area--><title>コメント no.<%eno> 【 <%blog_name> 】</title><!--/edit_area--> <!--date_area--><title><%now_year>年<%now_month>月 day<!--topentry-->.<%topentry_day> <!--/topentry--> 【 <%blog_name> 】</title><!--/date_area--> <!--not_index_area--><!--not_titlelist_area--><!--not_permanent_area--><!--not_edit_area--><title><%sub_title> no<!--topentry-->.<%topentry_no> <!--/topentry--> 【 <%blog_name> 】</title><!--/not_edit_area--><!--/not_permanent_area--><!--/not_titlelist_area--><!--/not_index_area--> <meta name="author" content="<%author_name>" /> <!--index_area--><meta name="description" content="<%introduction>" /><!--/index_area--> <!--permanent_area--><!--topentry--><!--topentry_tag--><meta name="keywords" content="<!--tag_list--><%topentry_tag_list_name>,<!--/tag_list--><%topentry_category>" /><!--/topentry_tag--><!--/topentry--><!--/permanent_area--> よろしければ教えてください。おねがいします
- ベストアンサー
- HTML
- ＦＣ2ブログ ユーザータグを本文中に一覧表示させたい
ＦＣ2ブログを使用しています。ユーザータグをサイドバー上ではなく、記事本文中に表示させることはできないでしょうか。 目的-------------------------- サイドバー上ではかなり縦長になってしまい、見栄えが悪くなりました。 そこで、記事を新規に用意して、そこに登録してある全タグを表示させたいんです。 記事本文中に、以下のように設定したのですが、表示されませんでした。 ******************************************************* <!--permanent_area--> <!--topentry_not_tag--> <!--ctag--> <a href="<%ctag_url>"><%ctag_name></a> <!--/ctag--> <!--/topentry_not_tag--> <!--/permanent_area--> ******************************************************* 同様のものをサイドバーのフリーエリアに挿入したときは表示されました。ユーザータグ関連の変数は本文では実現できないんでしょうか。 お分かりの方がいたらぜひ宜しくお願い致します。
- ベストアンサー
- ブログ
- wordpressの内容を他のサイトで反映するには
はじめまして。phpはほとんど分からないハナタレです。 クライアントから、webサイトの最新情報くらいは自分で更新したい、それも無料で！ と言われました。とりあえず無料のブログサービスで(アメブロ)情報を更新してもらい、そのブログのrssを取ってきてwebサイトに埋め込む事は出来ました。 ただ、さらに、クライアントが、最新情報をカテゴリーごとにまとめたいと言い出しました。いろいろ調べますと、無料のブログサービスではカテゴリーごとにフィードするのは無そうなので、wordpress(3.0.3)でなんとか出来ないかと奮闘中です。 wordpressでのrssでは、タイトルはtitleタグ、時間はpubDateタグ、本文のタグはcontent:encodedだったので、webサイトでのコードは... --------------------------------------------- <?php $url = "http://○○○/wordpress/feed/"; $rss = simplexml_load_file($url); foreach ($rss->channel->item as $j) { $title = $j->title; $time = $j->pubDate; $content = $j->content:encoded; echo "<dt>".date( "Y.m.d.", strtotime( $j->pubDate ) )."</dt>"; echo "<dd>". $title."</dd>"; echo "<dd>". $content."</dd>"; } ?> --------------------------------------------- と、しています。 $content = $j->content:encoded; という記述が間違っているのは何となく分かるのですが... どう記述すれば、ブログの内容をそのまま(画像や動画が埋め込まれていたらそれもそのまま反映させる)反映出来るのでしょうか。 wordpressをカスタマイズして最新情報だけそこへリンクさせればとも思うのですが、 反映させられる事を想定してcssも組んでしまったのでこのphpコードを上手く利用したいのです... どなたか、お分かりになる方、教えて頂けないでしょうか。
- 締切済み
- PHP
- 複数の<option>と一致するものを表示するには
サンプルで作ったコードは、 <select name="select1">の<option>、 <select name="select2">の<option>、 <select name="select3">の<option>で選び、その下にあるボタンを押すと、 <div class="sample_in">の<dd>タグ内と上記３つの項目に一致するにものだけを表示させたい と考え下記コードを作りました。しかし、select1とselect2は処理が行われません。 select3のみが処理されてしまいます。例えば・・・ 「1組,男子,おとなしい」を選んだ場合、サンプルでは一致するものは１つしかないので その親である<div class="sample_in">のみを表示させたいですが、 2組、女子でも表示の対象になり、一致するものが２つになってしまいます。 解決に役立つ様なプロパティやメソッドはないでしょうか。ヒントだけでもお願いします。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitio … <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>サンプル</title> <style type="text/css"> #mainBox { width: 300px; border: 3px solid black; padding: 10px; } .sample_in { width: 250px; border: 1px solid SteelBlue; padding: 10px; margin: 20px; } .sample_in dt { color: Magenta; } </style> </head> <body> <form name="myForm" action="#"> <select name="select1"> <option value="指定なし" selected="selected">指定なし</option> <option value="1組">1組</option> <option value="2組">2組</option> <option value="3組">3組</option> </select> <select name="select2"> <option value="指定なし" selected="selected">指定なし</option> <option value="男子">男子</option> <option value="女子">女子</option> </select> <select name="select3"> <option value="指定なし" selected="selected">指定なし</option> <option value="おとなしい">おとなしい</option> <option value="活発">活発</option> <option value="普通">普通</option> </select> <input type="button" value="OK" onclick="test0()"> </form> <div id="sample"> <div class="sample_in"> <dl><dt>組名</dt><dd>2組</dd></dl> <dl><dt>性別</dt><dd>女子</dd></dl> <dl><dt>性格</dt><dd>おとなしい</dd></dl> </div> <div class="sample_in"> <dl><dt>組名</dt><dd>1組</dd></dl> <dl><dt>性別</dt><dd>女子</dd></dl> <dl><dt>性格</dt><dd>普通</dd></dl> </div> <div class="sample_in"> <dl><dt>組名</dt><dd>1組</dd></dl> <dl><dt>性別</dt><dd>男子</dd></dl> <dl><dt>性格</dt><dd>おとなしい</dd></dl> </div> <div class="sample_in"> <dl><dt>組名</dt><dd>2組</dd></dl> <dl><dt>性別</dt><dd>女子</dd></dl> <dl><dt>性格</dt><dd>活発</dd></dl> </div> <div class="sample_in"> <dl><dt>組名</dt><dd>2組</dd></dl> <dl><dt>性別</dt><dd>男子</dd></dl> <dl><dt>性格</dt><dd>活発</dd></dl> </div> <div class="sample_in"> <dl><dt>組名</dt><dd>1組</dd></dl> <dl><dt>性別</dt><dd>男子</dd></dl> <dl><dt>性格</dt><dd>普通</dd></dl> </div> </div> <script type="text/javascript"> function test0() { var div1 = document.getElementById('sample'); var div2 = div1.children; var index1 = document.myForm.select1.selectedIndex; var index2 = document.myForm.select2.selectedIndex; var index3 = document.myForm.select3.selectedIndex; var str1 = document.myForm.select1.options[index1].text; var str2 = document.myForm.select2.options[index2].text; var str3 = document.myForm.select3.options[index3].text; var ary = [str1, str2, str3]; for(m=0; m<ary.length; m++){ for(i=0, len1=div2.length; i<len1; i++){ var dd = div2[i].getElementsByTagName("dd"); for(j=0, len2=dd.length; j<len2; j++){ var ddText = dd[j].textContent; if( ary[m] == ddText ){ dd[j].parentNode.parentNode.style.display = ''; break; }else{ dd[j].parentNode.parentNode.style.display = 'none'; } } } } alert("エラーなし"); //動作確認用 } </script></body></html>
- ベストアンサー
- JavaScript
- タイトルタグの重複の減らし方
タイトルタグの重複の減らし方 あるサイトで <title><!--not_index_area--><%sub_title><!--/not_index_area--> <!--not_permanent_area--><%blog_name> <!--/not_permanent_area--></title> <!--not_permanent_area-->～<!--/not_permanent_area--> このようにすると減るというので昨日やってみました。すぐに反映されないようなんでまだ逆に増えちゃってますけど、これでほんとに減るのでしょうか？現在タイトルタグの重複が７４６もあります。 やっぱりタイトルタグが増えると検索エンジンにも不利なんでしょうか？昨日からほとんどの記事がグーグルから圏外にされちゃったんでタイトルタグの重複が原因かなとおもってしまってます。あとサイトマップは必ず作らないといけないでしょうか？
- ベストアンサー
- SEO
- FC2ブログでの固定ページについて
ＦＣ２ブログで固定ページを作成しました。 <!--not_category_area-->～<!--not_category_area--> <!--not_permanent_area-->～<!--/not_permanent_area--> で該当箇所を囲むことで、 カテゴリーページや個別記事には表示されないように 出来たのですが、 トップページ最下部の 「次のページへ」で次のページに行くと 固定記事が表示されています。 トップページだけに表示させたい場合、 どのように指定すればよいでしょうか？ 以下は私が試みたことです。 調べたところ、 <!--page_area--> ～ <!--/page_area--> という変数があることがわかりました。 それで<!--not_page_area--> ～ <!--/not_page_area--> で囲ってみるとトップページからも固定記事の表示が消えてしまいました。 そこで <!--index_area--><!--/index_area-->も加えたりしてみましたが、 ダメでした。 以上よろしくお願い致します。
- 締切済み
- ブログ
- スマホ表示でのjQueryの挙動がおかしい
jQueryで該当箇所をクリックすると、CSSで非表示にしていた部分を開く動作を実装したいのですがうまくいきません。 ちなみにWordPressで制作をしております。 スマホでタップすると閉じていた箇所が開くところまではいいのですが、勝手に閉じてしまいます。 PC表示では勝手に閉じる動作はありません。 解決策を教えていただけますと大変助かります。 どうぞよろしくお願いします。 ■固定ページ編集画面内の本文エリアに、下記コードを入力しました。 <script> $(function(){ $(“#list dt").on("click", function() { $(this).next().slideToggle(); }); }); </script> <div id="list”> <dl> <dt>あああああ</dt> <dd>いいいいい。</dd> </dl> ※WordPressのjQueryはv1.11.0です。
- ベストアンサー
- JavaScript
- html記述ミス？？
1730808の投稿の質問です。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <meta name="GENERATOR" content="Microsoft FrontPage 4.0"> <meta name="ProgId" content="FrontPage.Editor.Document"> <title>新しいページ 1</title> </head> <body> <DL> <DT><SCRIPT Language="JavaScript"> <DT><!--<!-- <DD>document.cookie=document.cookie+" ; expires=1-Jan-1997 00:00:00 GMT"; --> <DD>result=prompt("パスワードを入れて下さい",""); <DD>if(result != "<FONT color=red>password</FONT>") <DD>{ <DL> <DD>alert("パスワードが違います！") <DD>location.href="http://www.google.co.jp"; </DD></DL> <DD>} <DD>else <DD>{ <DL> <DD>F=new Date(); <DD>S=F.getTime(); <DD>document.cookie="&chk="+S+"&end"; <DD>location.href="secret.htm";</DD></DL> <DD>} <DT>//--> <DT></SCRIPT></DT></DL> </body> </html> 以下の記述を17308に投稿したサイトからコピーしたのですが、間違っているのかスクリプトがそのままＵＰされてしまいます。 改善点等ございましたらご教授お願いいたします。
- 締切済み
- ホームページ作成ソフト
- DD,DT,DDを横並び。paddingとmarginと無指定で
DD,DT,DDを横並び。paddingとmarginと無指定で 下記の内どれが一番使われているのでしょうか？ 理由も教えていただけれるとありがたいです。 dl,dt,dd{ margin:0; padding:0;} dt{ float:left; width:8em; } .list0 dd{ padding-left:7em;} .list2 dd{ margin-left:8em;} <div> <dl class="list0"> <dt>短いタイトル</dt> <dd>短い説明、短い説明、短い説明</dd> <dt>短いタイトル</dt> <dd>短い説明、短い説明、短い説明</dd> </dl> <br /> <dl class="list1"> <dt>短いタイトル</dt> <dd>短い説明、短い説明、短い説明</dd> <dt>短いタイトル</dt> <dd>短い説明、短い説明、短い説明</dd> </dl> <br /> <div class="list2"> <dl> <dt>短いタイトル</dt> <dd>短い説明、短い説明、短い説明</dd> </dl> <dl> <dt>短いタイトル</dt> <dd>短い説明、短い説明、短い説明</dd> </dl> </div> </div>
- ベストアンサー
- HTML
- jQueryのmouseoutについての質問です。
jQueryの質問です。 dtにマウスを合わせた時にddが表示し、dlの領域以外にマウスが外れるとdd が非表示させるような設定をしたいのですがうまくいきません。 子要素のddとかdtとかaに合わさるとすぐに非表示になってしまいます。 dl内は、どこを移動しても非表示にならずdl要素以外の箇所にマウスが合わ さった時に非表示になってほしいのですが どなたかアドバイスいただけないでしょうか？ 自分なりにはこのように記述してみました。 ■jQueryの記述 $(function(){ $("dt").mouseover(function(){ $("dd:not(:animated)").slideDown("slow"); }); $("dl").mouseout(function(){ $("dd:not(:animated)").slideUp("slow"); }); }); ■CSSの記述 <dl> <dt>スライドして表示状態を切り替える</dt> <dd> あああ<a href="#">ああああ</a>あああああああ ああああああああああああああああああああああああああああああああああ あああああああああああああ<a href="#">ああああ</a>あああああ<a href="#">ああ</a>あああああ </dd> </dl> デモURL： http://tegarude.web.fc2.com/faq/test.html
- 締切済み
- インターネットビジネス
お礼
ご回答ありがとうございます。 後に購入した『WordPress サイト構築スタイルブック』をリファーしてみたら、 <?php if(conditional tag): ?>～<?php endif;?> というタグがFC2のブロック変数に相当することが分かりました。 お騒がせしましたm(_ _)m しかし、確かにその方法でもできますね。 wordpressは自由度が高くて、編集していて楽しいです。 ありがとうございました！