<?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/"
	>

<channel>
	<title>ソースコード改変 - WordPressカスタマイズ、サイト作成メモ</title>
	<atom:link href="https://msn100.org/code/feed" rel="self" type="application/rss+xml" />
	<link>https://msn100.org/code</link>
	<description>WordPressサイト制作を手がけるToshiyuki TanakaのFAQ、ヒント、Tipsなどの覚え書きです</description>
	<lastBuildDate>Mon, 20 Oct 2025 03:45:30 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.8.3</generator>
	<atom:link rel='hub' href='https://msn100.org/?pushpress=hub'/>
<atom:link rel="hub" href="https://pubsubhubbub.appspot.com"/><atom:link rel="hub" href="https://pubsubhubbub.superfeedr.com"/><atom:link rel="hub" href="https://websubhub.com/hub"/><site xmlns="com-wordpress:feed-additions:1">106065909</site>	<item>
		<title>画像キャプション回りのHTMLタグをカスタマイズする</title>
		<link>https://msn100.org/code/caption_html.html</link>
					<comments>https://msn100.org/code/caption_html.html#comments</comments>
		
		<dc:creator><![CDATA[Kota]]></dc:creator>
		<pubDate>Thu, 21 Feb 2013 15:44:12 +0000</pubDate>
				<category><![CDATA[ソースコード改変]]></category>
		<category><![CDATA[functions.php]]></category>
		<category><![CDATA[画像]]></category>
		<category><![CDATA[キャプション]]></category>
		<category><![CDATA[HTMLタグ]]></category>
		<category><![CDATA[ショートコード]]></category>
		<guid isPermaLink="false">http://msn100.org/?p=177</guid>

					<description><![CDATA[<p>画像にキャプションを入れると、WordPressは画像タグを&#60;img&#62;タグで囲み、キャプションを&#60;p&#62;タグで囲んで、それらを&#60;div&#62;でくくって、さらにstyle属性で「画像＋10px [&#8230;]</p>
<p><a href="https://msn100.org/code/caption_html.html">画像キャプション回りのHTMLタグをカスタマイズする</a>は<a href="https://msn100.org">WordPressカスタマイズ、サイト作成メモ</a>で公開された投稿です。</p>
]]></description>
										<content:encoded><![CDATA[<p>画像にキャプションを入れると、WordPressは画像タグを&lt;img&gt;タグで囲み、キャプションを&lt;p&gt;タグで囲んで、それらを&lt;div&gt;でくくって、さらにstyle属性で「画像＋10px」の横幅を指定してしまいます。こういうソースですね。</p>
<pre class="brush: xml; light: true; title: ; notranslate">&lt;div id=&quot;attachment_65&quot; class=&quot;wp-caption alignleft&quot; style=&quot;width: 130px&quot;&gt;</pre>
<p>これは画像が120pxの例です。このwidth属性でレイアウトの自由度が損なわれるので、この指定を削除する、あるいは任意のclassを追加する、といったカスタマイズ法です。ソースコードはいじらず、function.phpへの記述追加で可能です。<br />
<span id="more-177"></span></p>
<p>このHTMLタグを吐き出しているのは、<strong>wp-include内のmedia.php</strong>です。Ver3.51のmedia.phpでは654行目に</p>
<pre class="brush: php; light: true; title: ; notranslate">return '&lt;div ' . $id . 'class=&quot;wp-caption ' . esc_attr($align) . '&quot; style=&quot;width: ' . (10 + (int) $width) . 'px&quot;&gt;'</pre>
<p>という記述があり、ここで取得した画像の横幅$widthに10を加えてstyleのwidthとして入れています。</p>
<p>ですのでこの行を書き換えれば出力されるタグも変更できますが、やはりコアファイルはいじりたくないものです。WPのバージョンアップのたびに書き直さないとなりませんし。</p>
<p>こういう出力ソースを変更したい場合は、たいがいフィルターで処理するのですが、ここはショートコードで処理されています。ショートコードは自分でPHPソースなどを文中に挿入するときなどに使うもので、ユーザーが作成するものと思いがちですが、WPのデフォルトでいくつか（４つと以前聞きました）仕込まれているショートコードもあり、このキャプション回りもその一つです。</p>
<p>ですのでフィルターではうまく処理ができませんでした（もちろん私の技術力不足の可能性も大ですが）。そこで、ショートコードを加えているなら、オリジナルのショートコードを作成して、それを好きな出力設定に変更して適応させる、という方法にしてみたらうまくいきました。</p>
<p>そのやり方ですが、media.phpでは、まず</p>
<pre class="brush: php; light: true; title: ; notranslate">add_shortcode('caption', 'img_caption_shortcode');</pre>
<p>で <strong>img_caption_shortcode</strong> というショートコードを caption に適応させていることがわかります（610行目）。この行をコピーしてfunction.phpにペースとして、ショートコード名をオリジナルに変更します。</p>
<pre class="brush: php; light: true; title: ; notranslate">add_shortcode('caption', 'my_img_caption_shortcode');</pre>
<p>のように、 <strong>my_img_caption_shortcode</strong> を適応させるようにします（名称は任意です）。</p>
<p>そして、media.phpの628行目から始まるimg_caption_shortcodeの中身を626行目まで丸ごとコピーして、これもfunction.phpにペースト。</p>
<p>そして、まずfunction名の「img_caption_shortcode」を、自分が付けた新しい名前（今の例ではmy_img_caption_shortcode）に変更して、あとは自分が出力したいように中身を書き換えればOKです。基本的には最後の <strong>return</strong> 以降の部分の書き換えになると思います。私はstyel属性を削除したかったので、こんなふうにその部分を除いたソースにしました。</p>
<pre class="brush: php; highlight: [25]; title: ; notranslate">function my_img_caption_shortcode($attr, $content = null) {
	if ( ! isset( $attr&#x5B;'caption'] ) ) {
		if ( preg_match( '#((?:&lt;a &#x5B;^&gt;]+&gt;\s*)?&lt;img &#x5B;^&gt;]+&gt;(?:\s*&lt;/a&gt;)?)(.*)#is', $content, $matches ) ) {
			$content = $matches&#x5B;1];
			$attr&#x5B;'caption'] = trim( $matches&#x5B;2] );
		}
	}

	$output = apply_filters('img_caption_shortcode', '', $attr, $content);
	if ( $output != '' )
		return $output;

	extract(shortcode_atts(array(
		'id'	=&gt; '',
		'align'	=&gt; 'alignnone',
		'width'	=&gt; '',
		'caption' =&gt; ''
	), $attr));

	if ( 1 &gt; (int) $width || empty($caption) )
		return $content;

	if ( $id ) $id = 'id=&quot;' . esc_attr($id) . '&quot; ';

	return '&lt;div ' . $id . 'class=&quot;wp-caption ' . esc_attr($align) . '&quot;&gt;'
	. do_shortcode( $content ) . '&lt;p class=&quot;wp-caption-text&quot;&gt;' . $caption . '&lt;/p&gt;&lt;/div&gt;';
}</pre>
<p>classやHTMLタグを入れたり、といった改変も可能なはずです。</p>
<p>もしかしたらもっとスマートなやり方があるかもしれませんので、ご存じの方は教えていただければ幸いです。</p>
<p>ちなみに以下のページの「ギャラリーのカスタマイズ法」を参考に、キャプション部分に応用してトライしてみました。どうもありがとうございました。</p>
<p>参考：<a href="http://y2web.net/blog/inet/wp/gallery-customize-618/">y2blog » WordPressの『ギャラリー』をカスタマイズする</a></p>
<p><a href="https://msn100.org/code/caption_html.html">画像キャプション回りのHTMLタグをカスタマイズする</a>は<a href="https://msn100.org">WordPressカスタマイズ、サイト作成メモ</a>で公開された投稿です。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://msn100.org/code/caption_html.html/feed</wfw:commentRss>
			<slash:comments>4</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">177</post-id>	</item>
		<item>
		<title>投稿画面に任意の表示エリアを追加</title>
		<link>https://msn100.org/dashboard/contents-box.html</link>
					<comments>https://msn100.org/dashboard/contents-box.html#comments</comments>
		
		<dc:creator><![CDATA[Kota]]></dc:creator>
		<pubDate>Wed, 23 Jan 2013 10:41:50 +0000</pubDate>
				<category><![CDATA[ソースコード改変]]></category>
		<category><![CDATA[ダッシュボード]]></category>
		<category><![CDATA[functions.php]]></category>
		<category><![CDATA[投稿画面]]></category>
		<guid isPermaLink="false">http://msn100.org/?p=89</guid>

					<description><![CDATA[<p>以前「ダッシュボードにメモ欄を追加する」記事を書きましたが、今度は管理画面の投稿画面に、メモなどの任意のコンテンツを表示するエリアを追加する方法です。 追加するには、functions.phpに以下のコードを追加します。 [&#8230;]</p>
<p><a href="https://msn100.org/dashboard/contents-box.html">投稿画面に任意の表示エリアを追加</a>は<a href="https://msn100.org">WordPressカスタマイズ、サイト作成メモ</a>で公開された投稿です。</p>
]]></description>
										<content:encoded><![CDATA[<p>以前「<a title="ダッシュボードにメモ欄を追加する" href="http://msn100.org/wp_plugin/headache.html">ダッシュボードにメモ欄を追加する</a>」記事を書きましたが、今度は管理画面の投稿画面に、メモなどの任意のコンテンツを表示するエリアを追加する方法です。</p>
<p><span id="more-89"></span></p>
<p>追加するには、<strong>functions.php</strong>に以下のコードを追加します。</p>
<pre class="brush: php; highlight: [7]; title: ; notranslate">
function add_free_box() {
  global $post;
  echo '
エリア内のコンテンツ文

';
}

function add_free_box_hooks() {
  add_meta_box('free_box', '表示エリアタイトル', 'add_free_box', 'post', 'side', 'high');
}

function add_free_box_init() {
  add_action('admin_menu', 'add_free_box_hooks');
}

add_action('init', 'add_free_box_init');</pre>
<p>以上のソースを追加すると、投稿画面の右サイドバーに表示エリアが追加されます。</p>
<div id="attachment_91" style="width: 305px" class="wp-caption alignnone"><img fetchpriority="high" decoding="async" aria-describedby="caption-attachment-91" class="size-full wp-image-91" alt="引き数が'side'の場合" src="http://msn100.org/wp/wp-content/uploads/contents_box01.png" width="295" height="331" /><p id="caption-attachment-91" class="wp-caption-text">引き数が&#8217;side&#8217;の場合</p></div>
<p>ソース内の <strong>add_meta_box()</strong> 関数の5番目の引き数を「<strong>side</strong>」にしているので、投稿画面のサイドバーに表示されます。これを「<strong>normal</strong>」にすると、投稿本文エリア側に表示されます。</p>
<div id="attachment_93" style="width: 546px" class="wp-caption alignnone"><img decoding="async" aria-describedby="caption-attachment-93" class="size-full wp-image-93" alt="引き数をnormalにした場合" src="http://msn100.org/wp/wp-content/uploads/contents_box02.png" width="536" height="557" /><p id="caption-attachment-93" class="wp-caption-text">引き数が&#8217;normal&#8221;の場合</p></div>
<p>また4番目の引き数を「post」にすると投稿画面に、「page」にすると固定ページ画面に、またカスタム投稿タイプのスラッグを入れるとそのカスタム投稿タイプ画面に表示されます。</p>
<p>参考：<a href="http://kachibito.net/wordpress/admin-area-customize.html">WordPressをクライアントワークで使用する際に覚えておくと良さそうな管理画面のカスタマイズ用コードいろいろ &#8211; かちびと.net</a></p>
<p><a href="https://msn100.org/dashboard/contents-box.html">投稿画面に任意の表示エリアを追加</a>は<a href="https://msn100.org">WordPressカスタマイズ、サイト作成メモ</a>で公開された投稿です。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://msn100.org/dashboard/contents-box.html/feed</wfw:commentRss>
			<slash:comments>1</slash:comments>
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">89</post-id>	</item>
		<item>
		<title>メタタグのWPのバージョン情報をヘッダー内から削除する</title>
		<link>https://msn100.org/code/no_version.html</link>
		
		<dc:creator><![CDATA[Kota]]></dc:creator>
		<pubDate>Mon, 17 Dec 2012 16:42:27 +0000</pubDate>
				<category><![CDATA[ソースコード改変]]></category>
		<category><![CDATA[メタタグ]]></category>
		<category><![CDATA[バージョン情報]]></category>
		<category><![CDATA[functions.php]]></category>
		<guid isPermaLink="false">http://msn100.org/?p=18</guid>

					<description><![CDATA[<p>WordPressはデフォルトでは、htmlヘッダー内に以下のメタタグが自動的に挿入されます。 &#60;meta name=&#34;generator&#34; content=&#34;WordPress 3. [&#8230;]</p>
<p><a href="https://msn100.org/code/no_version.html">メタタグのWPのバージョン情報をヘッダー内から削除する</a>は<a href="https://msn100.org">WordPressカスタマイズ、サイト作成メモ</a>で公開された投稿です。</p>
]]></description>
										<content:encoded><![CDATA[<p>WordPressはデフォルトでは、htmlヘッダー内に以下のメタタグが自動的に挿入されます。</p>
<pre class="brush: xml; light: true; title: ; notranslate">&lt;meta name=&quot;generator&quot; content=&quot;WordPress 3.5&quot; /&gt;</pre>
<p>バージョン情報が記載されたままだと、そのバージョンの脆弱性を衝く攻撃を受ける可能性があります。また個人的には（WordPressにはお世話になってますが）一般のサイトなどでは、WPを使っている、ということを明示したくない場合があります。<span id="more-18"></span></p>
<p>そこでこのメタタグを挿入させないようにする方法です。</p>
<p>使っているテーマファイルの「<strong>functions.php</strong>」を開いて、以下の一文を追加するだけです。</p>
<pre class="brush: php; light: true; title: ; notranslate">remove_action('wp_head','wp_generator');</pre>
<p>ちょっとした小技ですが、覚えておきたいネタです。</p>
<p><a href="https://msn100.org/code/no_version.html">メタタグのWPのバージョン情報をヘッダー内から削除する</a>は<a href="https://msn100.org">WordPressカスタマイズ、サイト作成メモ</a>で公開された投稿です。</p>
]]></content:encoded>
					
		
		
		<post-id xmlns="com-wordpress:feed-additions:1">18</post-id>	</item>
	</channel>
</rss>
