<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
		xmlns:xhtml="http://www.w3.org/1999/xhtml"
>

<channel>
	<title>MujuuLog &#187; NextGenGallery</title>
	<atom:link href="http://mujuu.org/weblog/tag/nextgengallery/feed" rel="self" type="application/rss+xml" />
	<link>http://mujuu.org/weblog</link>
	<description>Web・自転車・写真など適当なメモ書き的なブログサイトです。</description>
	<lastBuildDate>Mon, 05 Dec 2011 14:45:08 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.2</generator>
<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://mujuu.org/weblog/tag/nextgengallery/feed" />
		<item>
		<title>NextGenGalleryを使う。</title>
		<link>http://mujuu.org/weblog/web_memo/195</link>
		<comments>http://mujuu.org/weblog/web_memo/195#comments</comments>
		<pubDate>Thu, 23 Apr 2009 06:02:04 +0000</pubDate>
		<dc:creator>shin2</dc:creator>
				<category><![CDATA[Webメモ書き]]></category>
		<category><![CDATA[WordPress]]></category>
		<category><![CDATA[NextGenGallery]]></category>
		<category><![CDATA[web]]></category>

		<guid isPermaLink="false">http://www.mujuu.org/weblog/?p=195</guid>
		<description><![CDATA[WPのテーマをカスタムするにあたって、[サムネール一覧表示]→[クリック]→[thickboxで表示]ができるフォトギャラリー機能を設けるために、NextGenGalleryというプラグインを導入。 使い方は、alex. [...]]]></description>
			<content:encoded><![CDATA[<p>WPのテーマをカスタムするにあたって、[サムネール一覧表示]→[クリック]→[thickboxで表示]ができるフォトギャラリー機能を設けるために、NextGenGalleryというプラグインを導入。</p>
<p>使い方は、<a href="http://alexrabe.boelinger.com/wordpress-plugins/nextgen-gallery/" target="_blank">alex.rabe</a>からダウンロードして、wpのpluginsのフォルダにフォルダごとFTPでアップ。WPの管理画面のプラグインから起動。管理画面左メニューの一番下にGalleryの項目が追加される。Galleryの中のAdd Gallery / Imagesから写真をアップロードし登録。ページや投稿記事に次のコードを [] 内に</p>
<p>nggallery id=（idのナンバー）</p>
<p>入れれば、そのidに応じたギャラリーの写真のサムネール一覧が表示される。idのナンバーはManage Galleryで管理されるIDのナンバーを入れる。表示の内容は[タグ]でいろいろ指定ができるみたい。<a href="http://wordpress.org/extend/plugins/nextgen-gallery/faq/" target="_blank">タグの一覧</a></p>
<p>と非常に簡単でした。他にもいくつか設定項目があり上手くやればかなり自在に扱えそう。</p>
<ul>
<li>AlbumにはGalleryを複数まとめることが出来るみたい。</li>
<li>Optionの項目で、サムネールサイズや元画像の表示方法にthickboxなど選択できる。</li>
</ul>
<p>このサイトでは、サイドバーに常にランダムで10枚ほど表示しておきたかったので、NextGenGalleryに登録した写真を、sidebar.phpに直接phpで呼び出しています。<br />
<a href="http://blog.hycko.net/nextgen-gallery%E3%81%AE%E3%82%B9%E3%83%A9%E3%82%A4%E3%83%89%E3%82%B7%E3%83%A7%E3%83%BC%E3%81%AA%E3%81%A9%E3%82%92php%E3%82%BF%E3%82%B0%E3%82%92%E4%BD%BF%E3%81%A3%E3%81%A6%E7%9B%B4%E6%8E%A5%E5%85%A5/194/" target="_blank">hycko.blog</a>さんを参考にさせていただきました。（こういうように分かりやすく解説してくれる人がいると、頭の悪い自分には非常に助かるね。）</p>
<p><span id="more-195"></span></p>
<p>■スライドショーの表示<br />
これをsidebar.phpなどの表示させたいファイルに記述。</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">&lt;?php</span>
<span style="color: #b1b100;">if</span> <span style="color: #009900;">&#40;</span><span style="color: #990000;">function_exists</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">&quot;nggSlideshowWidget&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
	nggSlideshowWidget<span style="color: #009900;">&#40;</span><span style="color: #000088;">$galleryID</span><span style="color: #339933;">,</span><span style="color: #000088;">$width</span><span style="color: #339933;">,</span><span style="color: #000088;">$Height</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span>
<span style="color: #000000; font-weight: bold;">?&gt;</span></pre></div></div>

<p>$galleryID…ギャラリーのID<br />
$Width…表示領域の横幅<br />
$Height…表示領域の縦幅</p>
<p>■ランダムな表示</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">&lt;?php</span>
<span style="color: #b1b100;">if</span> <span style="color: #009900;">&#40;</span><span style="color: #990000;">function_exists</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">&quot;nggDisplayRandomImages&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
	nggDisplayRandomImages<span style="color: #009900;">&#40;</span><span style="color: #000088;">$number_of_pic</span><span style="color: #339933;">,</span><span style="color: #000088;">$width</span><span style="color: #339933;">,</span><span style="color: #000088;">$Height</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span>
<span style="color: #000000; font-weight: bold;">?&gt;</span></pre></div></div>

<p>$number_of_pic…表示する画像の枚数<br />
$Width…1枚の画像の横幅<br />
$Height…1枚の画像の縦幅</p>
<p>■最近ギャラリーに追加した写真</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">&lt;?php</span>
<span style="color: #b1b100;">if</span> <span style="color: #009900;">&#40;</span><span style="color: #990000;">function_exists</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">&quot;nggDisplayRecentImages&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
	nggDisplayRecentImages<span style="color: #009900;">&#40;</span><span style="color: #000088;">$number_of_pic</span><span style="color: #339933;">,</span><span style="color: #000088;">$width</span><span style="color: #339933;">,</span><span style="color: #000088;">$Height</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span>
<span style="color: #000000; font-weight: bold;">?&gt;</span></pre></div></div>

<p>$number_of_pic…表示する画像の枚数<br />
$Width…1枚の画像の横幅<br />
$Height…1枚の画像の縦幅</p>
<p>【参考にしたサイト】</p>
<ul>
<li><a href="http://alexrabe.boelinger.com/wordpress-plugins/nextgen-gallery/" target="_blank">alex.rabe</a></li>
<li><a href="http://blog.hycko.net/nextgen-gallery%E3%81%AE%E3%82%B9%E3%83%A9%E3%82%A4%E3%83%89%E3%82%B7%E3%83%A7%E3%83%BC%E3%81%AA%E3%81%A9%E3%82%92php%E3%82%BF%E3%82%B0%E3%82%92%E4%BD%BF%E3%81%A3%E3%81%A6%E7%9B%B4%E6%8E%A5%E5%85%A5/194/" target="_blank">hycko.blog</a></li>
</ul>
<p>■その他メモ</p>
<p>NextGenGalleryのプラグインをONにしてEffectからthiickboxを選択すると、header.phpに記述してるテンプレートタグwp_head();部分に自動的に</p>

<div class="wp_syntax"><div class="code"><pre class="html" style="font-family:monospace;">&lt;link rel='stylesheet' href='http://www.mujuu.org/weblog/wp-includes/js/thickbox/thickbox.css?ver=20081210' type='text/css' media='all' /&gt;
&lt;script src=&quot;http://www.mujuu.org/weblog/wp-includes/js/jquery/jquery.js?ver=1.2.6&quot; type=&quot;text/javascript&quot;&gt;&lt;!--mce:0--&gt;&lt;/script&gt;
&lt;script type='text/javascript' src='http://www.mujuu.org/weblog/wp-includes/js/thickbox/thickbox.js?ver=3.1-20090123'&gt;&lt;/script&gt;</pre></div></div>

<p>などjqueryやthickbox関係のjs・cssの外部ファイルを自動的に読み込んでくれるみたいだ。</p>
<p>NextGenGalleryを入れる前から自前で読み込ませていたので、結果2重に読み込ませることになってしまって気持ちが悪かったので、以前読み込んでいたモノを削除。</p>
]]></content:encoded>
			<wfw:commentRss>http://mujuu.org/weblog/web_memo/195/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
	<xhtml:link rel="alternate" media="handheld" type="text/html" href="http://mujuu.org/weblog/web_memo/195" />
	</item>
	</channel>
</rss>

