WPのアーカイブの下に「1.2.3....」数字のページのナビを付ける。

WPの記事の下にページのナビを付ける。

ページの下に数字でのナビがあると便利ですよね。
その方法です。

WP-PageNavi　をまずダウンロードします。
http://lesterchan.net/portfolio/programming/php/#wp-pagenavi
インストール後プラグインを有効にして、
<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); } ?>

をindex.phpやarchive.phpなどナビを付けたい箇所に追加しましょう。

それでOKですー！

参考サイト
http://wpgogo.com/plugin/plugin_wp_pagenavi.html

WPのカテゴリ事に画像を変える

ヘッダーにphpぶっ込んで、CSSでカテゴリのidで指定する。

まずヘッダーのイメージを変更した箇所に以下をぶっ込む
///////////////////////////////////////////////////////////

<?php if( is_home() ) : // フロントページの場合 ?>

<?php elseif( is_month() ) : // 月別ページの場合 ?>

<?php else : // それ以外の場合

$cat = get_the_category();

$cat = $cat[0];

?>

<div class="cat-<?php echo $cat->cat_ID; ?>"></div>

<?php endif; ?>

///////////////////////////////////////////////////////////

それからcssで

cssの記述は下記の通り(※赤字部分は自サイトに合わせて変更）
.cat-1 {
background:url(images/head_img01.jpg) no-repeat;
width: 900px;
height: 250px;
}
.cat-2 {
background:url(images/head_img02.jpg) no-repeat;
width: 900px;
height: 250px;
}
.cat-3 {
background:url(images/head_img03.jpg) no-repeat;
width: 900px;
height: 250px;
}

をぶっ込むとやっほーだぜ！！

参考サイト
http://msweb.moo.jp/wordpress/483/

WPのテンプレ改造に良いフリーのMONO

新しいバージョンは結構改造しやすくなってきたと思ってますが、
バージョンが古くなるとやりにくく感じてもす。

んで、簡単目に改造できるフリーのテンプレサイト発見した。
 http://wpthemejp.com/
ここの作りわかりやすい！！

WP 固定ページのタイトルとコメント欄を消す方法

「外観」→「テーマ編集」→「loop-page.php」と辿り、「<?php comments_template( '', true ); ?>」を削除する。

これでコメント欄がきえます。


同様に

<?php if ( is_front_page() ) { ?>
                        <h2 class="entry-title"><?php the_title(); ?></h2>
                    <?php } else { ?>
                        <h1 class="entry-title"><?php the_title(); ?></h1>
                    <?php } ?>

を消すとタイトルが消えます。

テンプレは

Twenty Ten

です。

固定ページをTOPページに使用してる場合は便利ですね。 

WPのフロントページをアーカイブの用に抜粋のテキストだけにする方法

http://blue-spiral.matrix.jp/20110611-wordpress-archive.html

Twenty Ten において、アーカイブでの表示は抜粋表示になっていますが、フロントページにおいてもアーカイブにならないか？
フロントページでは最新の記事の抜粋記事を10個表示させたい。

そこでまずやってみたことは、フロントページ用にfront-page.phpを用意すること。
front-page.phpと言っても中身は、archive.phpそのまんま。

結果は・・・、ダメでした。

原因は、loop.phpを読み込んでいて、loop.phpにおいて抜粋表示は、アーカイブかサーチの時だけ。

if ( is_archive() || is_search() )

ということは、ここにフロントページも加えてあげればいいのでは？

if ( is_archive() || is_search() || is_home() )

以上のものが2カ所あるのでそれぞれ替えてみた。
そして、別名保存でloop-archive.phpとしました。

成功しました！

しかし、記事の単体表示以外はアーカイブにするようなものなので、小テーマ実現するにはloop.phpをコピーして「is_home()」を加えればいいだけでした。

WPのフロントページの記事を「続きを読む」にして短くする。

記事を入力するエディターの上の段に書類が切れたアイコン（more）があるので、
切りたい箇所でそのアイコンをクリックするとでけた。

今まできづかなかった。

WPのマルチサイト化

WP3からマルチサイト化ができるようになったので、使用してみました。




http://lovelog.eternal-tears.com/wordpress/wp-custom/wp-core/wordpress30-multi/


このblogみてやりました。

WP内でカテゴリー事にテンプレートを変更する。

カテゴリー事にテンプレートを変更できます。

http://web-taiyo.com/wordpress-plugin/theme_switcher.html

http://wordpress.org/extend/plugins/wp-theme-switcher/

から「wp-theme-switcher.zip」をDLしてサイトにインストルします。

設定からカテゴリーのアドレスをテンプレの箇所に入力しておわり。

ヘテムルの場合は.htaccessが必要。
http://heteml.jp/support/manual/php5/

rootとプラグインのフォルダに入れると使えます。


BMDのサイトで使用してます。

バクレツフォルダにも「WPテーマ事にデザインを変更」で素材はいってます。

ワードプレスのページ制作について

http://webdesignrecipes.com/wordpress-customize-with-template-files/

この記事えーわー。

ワードプレスで個別ページ作る時に2カラムにしたり、1つにしたりできて、便利でした。

ワードプレスのテンプレートの文字化け

テンプレートを作ってると、アップした時に文字化けしてる時があるので、直す方法。

・DWとテンプレの文字コードを合わせる。

普通で当たりまえ。

これで出来ない場合、正当なやり方かどうかわからないですが、
各データに文字コードを入れると直る。

footer.phpやheadder.php等各データに文字コード指定してやる。

「meta http-equiv="Content-Type" content="text/html; charset=UTF-8"」

のような感じで。

http://www.dspt.net/html_tag/001_data/017.html


この方法は成功塾で使用してます。

WPでいいねボタンのプラグイン

ワードプレスにファイスブックのイイネボタンを設置
http://www.taskmother.com/wordpress/363.html

ここで紹介してもろたプラグインを使用しました。

「facebook-like-button.5.9.2.zip」

XFBMLとIFRAMEが選択出来る所はIFRAMEに選択したら上手くいきました。
あとは記事事かページ事か等、の配置する箇所を選択して。終了。簡単でした。
英語だけど、なんとなくわかるんで大丈夫。


あと、フェイスブック以外のSNS　ツイッターや、ミクシーチェック等の様々なボタンを設置できるのもありました。

http://nm705.com/tech/wp/220

ここに紹介されてるのが。
「wp-social-bookmarking-light.1.6.9.zip」

これも一括でボタンを配置できます。ちょうどこのブログ記事の下に配置されてるボタンと同じ感じの物です。

ただ、何故かいいねボタンが上手く配置できなかったので、諦めました。
なんでやろか？？

BMDのブログに二つとも実装中やけども「wp-social-bookmarking-light.1.6.9.zip」は停止させてます。

データはバクレツフォルダにあります。

文字サイズの変更

割りと簡単にできました。

http://www.skuare.net/2009/09/javascriptjquery_text_resizer.html

http://angstrey.com/index.php/projects/jquery-text-resizer-plugin/


divで指定した範囲の文字が変更される。

日大で使用してるので，確認して使おう。

バクレツフォルダにjsファイル入ってます。

css3 transition slider

こんど使わせていただこう。

スライド

http://kachibito.net/web-design/css3-transition-slider.html

joomla!1.5でgooglemapを使う

便利なプラグイン。

http://www.joomlaway.net/extension-new/external-contents/maps/957-plugin-googlemaps.html

ここに書いてる通りです。

記事がなくなるといけないんで、コピペしもす。

※ファイルは一応バクレツフォルダに入ってます。

フェアトレードで使用してるんで使うまえに確認しよう。

/////以下コピペ///////////////////

概要

• 記事にプラグインタグを入力する事でGoogle Mapsを表示できる。
• タグ入力時に様々なパラメータを指定可能。

インストール

ダウンロード後、「エクステンション」→「インストール/アンインストール」からインストールして下さい。その後、プラグインを有効してください。

初期設定

1. プラグインの設定画面を開き、「Google API」にGoogle Map APIキーを入力します。
2. 「Google website」から「Japan(maps.google.jp)」を選択します。
3. そのほか必要に応じてGoogleマップのデフォルト値を設定します。サイト全体で共通にしたい設定を行えば良いでしょう（例えばマップの幅、高さ、初期のズームレベルなど）。

Googleマップを埋め込む

記事にプラグインのタグを入力する事でマップを表示できます。この際にプラグインのパラメータも指定できます。
例えばGoogleマップを埋め込みたい記事に次のタグを入力します。

{mosmap}

記事を表示するとGoogleマップが表示されます。今回のようにオプションを指定しない場合は、プラグインのパラメータに設定された Latitude（緯度）、longitude （経度）が使用されます。
例えば緯度と経度を指定するには次の様にします（以下の場所は東京タワーです）

{mosmap lat='35.658587'|lon='139.745425'}

パラメータ名='値'と言う形式でパラメータを指定し、複数指定する場合は'|'でつなげればOKです。パラメータの順序は関係有りません。例えばズームレベルを指定するなら次の様にします。

{mosmap lat='35.658587'|lon='139.745425'|zoom='16'}

インフォウインドウ(吹き出し）を表示したいなら次の様にします。

{mosmap lat='35.658587'|lon='139.745425'|zoom='16'|text='東京タワー'}

「text」のパラメータにはHTMLも利用できるので画像の埋め込みなども可能です。
また緯度と経度を指定しなくてもジオコーディングも可能です。

{mosmap address='東京タワー'}

次の様に指定するとマップの上に住所検索可能なテキストボックスが表示されます。

{mosmap address='東京タワー'|gotoaddr='1'}

またKMLファイルも指定することが可能です。KMLファイルについて詳しくはこちらをご覧下さい。例えば以下は株式会社東京地図研究所で公開されている「東京銭湯マップ」を表示する例です。

{mosmap kml='http://www.t-map.co.jp/gallery/images/sento.kmz'}{/xtypo_code}

KMLファイルを使用すれば、1つのマップに2カ所以上のマーカーを表示する事ができます。
これ以外にも指定できるパラメータがありますので、詳しくは下記を参照して下さい。

• http://tech.reumer.net/Google-Maps/Documentation-of-plugin-Googlemap/Welcome.html

また下記はプラグインのデモというかTipsみたいなもんです。参考にして下さい。

• Demo Google Maps

カラーミーでライトボック使えましたよ。

カラーミーでライトボックスを使用できました。
できると思ってたけど。やはりできました。

jsを置くサーバーが他にいります。

そこにjsおいて、共通htmlに絶対パスで放り込みます。

そしてカラミの商品詳細の画像のリンクに

「rel="lightbox"」

記入したらうごきます。

closeのイメージなども絶対パスでないと出てこないです。

いまさらですが、dlが新着情報で使うのにピッタリでした。

新着に使える<di></dl>
日付と本文でわけるさいに有効なCSSです。


日大のスケジュールで使用してるので、忘れてたら見よう。
http://www.tagindex.com/template/list/update.html

ここみたら分かります。

jQueryとプロトタイプの共存

jsを使うようになり便利になったけど、追加し過ぎて無理な場合もよくありますが、

プロトタイプを先によませて

<script type="text/javascript">
<!--
jQuery.noConflict();
-->
</script>

をいれたら動きました。

参考
http://kanamehackday.blog17.fc2.com/blog-entry-144.html

例
<script src="../js/prototype.js" type="text/javascript"></script>
<script src="../js/jquery-1.2.6.js" type="text/javascript"></script>
<script src="../js/ui.core.js" type="text/javascript"></script>
<script src="../js/ui.tabs.js" type="text/javascript"></script>
<script type="text/javascript">
<!--
jQuery.noConflict();
-->
</script>

IEだけ高さがおかしい

font-size: 0;
にしたら解決しました。

他にも
http://coliss.com/articles/build-websites/operation/css/753.html
に解決策がありました。

IEはずれますわなー。