• 赤色のリンクは、まだ日本語Codexに存在しないページ・画像です。英語版と併せてご覧ください。(詳細

このWikiはいつでも誰でも編集できます

「WordPress ウィジェット」の版間の差分

提供: WordPress Codex 日本語版
移動先: 案内検索
(見出しの訳)
(最新英語版を反映 & 和訳完了 en:WordPress_Widgets 04:44, 23 August 2015‎ Atachibana版)
1行目: 1行目:
{{NeedTrans}}
 
 
__TOC__
 
__TOC__
WordPress Widgets add content and features to your [[Sidebars]]. Examples are the default widgets that come with WordPress; for post categories, tag clouds, navigation, search, etc. Plugins will often add their own widgets.
+
WordPress ウィジェットは[[Sidebars|サイドバー]]にコンテンツや機能を追加します。WordPress にはデフォルトで「カテゴリー」「タグクラウド」「検索」などのウィジェットがあります。ウィジェットを追加するプラグインもあります。
  
Widgets were originally designed to provide a simple and easy-to-use way of giving design and structure control of the WordPress Theme to the user, which is now available on properly "widgetized" WordPress Themes to include the header, footer, and elsewhere in the WordPress design and structure.
+
もともとウィジェットはユーザーに、WordPress テーマのデザインや構造を管理するシンプルで使いやすい方法を提供する目的で設計されました。現在では適切に「ウィジェット化」された WordPress テーマであれば、ヘッダーやフッターを始め、WordPress デザインや構造の多くでウィジェットを使用します。
Widgets require no code experience or expertise. They can be added, removed, and rearranged on the WordPress Administration '''Appearance > Widgets''' panel. The order and placement is set by the WordPress Theme in the <tt>functions.php</tt> file.
+
ウィジェットにプログラミングの経験やスキルは必要はありません。「テーマカスタマイザー」またはWordPress 管理画面の '''「外観」> 「ウィジェット」'''から追加、削除、並べ替えできます。
  
Some WordPress Widgets offer customization and options such as forms to fill out, includes or excludes of data and information, optional images, and other customization features.
+
カスタマイズをサポートする WordPres ウィジェットでは入力用のフォーム、データや情報の追加と削除、オプションの画像、その他のカスタマイズ機能などのオプションがあります。
  
The [[Widgets_SubPanel|Widgets SubPanel]] explains how to use the various Widgets that come delivered with WordPress.
+
[[Appearance_Widgets_Screen|管理画面/外観/ウィジェット]]」では WordPress に同梱されたさまざまなウィジェットの使い方が説明されています。
  
Plugins that come bundled with widgets can be found in the [http://wordpress.org/extend/plugins/ WordPress Plugin Directory].
+
ウィジェットがバンドルされたプラグインは [https://ja.wordpress.org/plugins/ WordPress プラグインディレクトリ]で検索できます。
  
 
<div id="Installing Widgets">
 
<div id="Installing Widgets">
16行目: 15行目:
 
</div>
 
</div>
  
WordPress comes pre-packaged with a variety of [http://codex.wordpress.org/Glossary#Widget Widgets]. If those are insufficient for your needs you can install new ones by searching the WordPress Plugins Directory which is accessible from the Plugins -> Add New menu.
+
WordPress にはさまざまな [[Glossary#Widget ウィジェット]] が同梱されていますが、不足の場合は管理画面の '''「プラグイン」>「新規追加」''' から [https://ja.wordpress.org/plugins/ WordPress プラグインディレクトリ] にアクセスし、新しいウィジェットを検索、追加できます。
  
 
<div id="Displaying Widgets">
 
<div id="Displaying Widgets">
26行目: 25行目:
 
</div>
 
</div>
  
[[File:widget-panel.png|200px|thumb|right|Example of the WordPress Widget Panel]]
+
ウィジェットを追加する前に、使用中のテーマがウィジェットをサポートするかどうか、正確には  [[Glossary#Widget_Area ウィジェットエリア]] をサポートするかどうかを確認する必要があります。と言っても方法は単純で管理画面の「外観」メニューの下に「ウィジェット」サブメニューがあればサポートされています。
Before you can add a Widget you must verify that the Theme you're using supports Widgets (more specifically: [http://codex.wordpress.org/Glossary#Widget_Area Widget Areas]). You can do so by simply navigating to the Appearance menu and looking for a sub menu titled "Widgets". If it does, you can add widgets by following these steps:
+
  
# Go to Appearance > Widgets.
+
テーマが「テーマカスタマイザー」をサポートしていれば次の手順でウィジェットを追加できます。「テーマカスタマイザー」では変更をすぐにプレビューできます。
# Choose a Widget and either drag it to the sidebar where you wish it to appear, or click the widget, (select a destination sidebar if your theme has more than one) and click the Add Widget button. There might be more than one sidebar option, so begin with the first one. Once in place, WordPress automatically updates the Theme.
+
# Preview the site. You should find that the "default" sidebar elements are now gone and only the new addition is visible.
+
# Return to the Widgets Panel to continue adding Widgets.
+
# To arrange the Widgets within the sidebar or Widget area, click and drag it into place.
+
# To customize the Widget features, click the down arrow in the upper right corner to expand the Widget's interface.
+
# To save the Widget's customization, click Save.
+
# To remove the Widget, click Remove or Delete.
+
  
If you change WordPress Themes, the Widgets will return to the left side of the page in the Widget Archives or Available Widgets list. You may need to add them again and rearrangement depending upon the Theme's ability to preserve other Theme's Widgets.
+
 
 +
[[Image:appearance-customize-widgets.png|400px||外観 カスタマイザー ウィジェット画面]]
 +
 
 +
 
 +
# 管理画面で '''「外観」> 「カスタマイズ」''' にアクセスします。
 +
# テーマカスタマイザーで '''ウィジェット''' をクリックします。ウィジェットカスタマイズ用画面に移動します。
 +
# '''ウィジェットエリア''' 右側の下向き矢印をクリックします。登録済みのウィジェット一覧が表示されます。
 +
# サイドバー下部の「ウィジェットを追加」ボタンをクリックしてください。利用可能なウィジェットの一覧が表示されます。
 +
# 追加するウィジェットをクリックしてください。ウィジェットがサイドバーに追加されます。
 +
# プレビューで確認します。新しいウィジェットでコンテンツが表示されます。
 +
# サイドバー内でウィジェットを並べ替えるには、ウィジェットをドラッグアンドドロップして希望の順番に並べるか、「並べ替え」リンクをクリックして、各ウィジェットの上向き矢印、下向き矢印をクリックし、最後に「完了」をクリックします。
 +
# ウィジェットの機能をカスタマイズするには、右側の '''下向き矢印''' をクリックし、ウィジェットインターフェースを開きます。
 +
# ウィジェットを削除するには、上の手順のウィジェットインターフェースで '''削除''' をクリックします。
 +
 
 +
 
 +
テーマが「カスタマイザー」をサポートしていなければ、次の従来の手順でウィジェットを追加できます。
 +
 
 +
 
 +
[[Image:widgets.png|400px||外観 ウィジェット画面]]
 +
 
 +
 
 +
# 管理画面で '''「外観」> 「ウィジェット」''' にアクセスします。
 +
# ウィジェットを選択し、サイドバーの希望の位置にドラッグするか、ウィジェットをクリックし、テーマが複数のサイドバーをサポートしている場合はサイドバーを選択し、「ウィジェットを追加」ボタンをクリックします。複数のサイドバーオプションがある場合は、最初のサイドバーから始めてください。ウィジェットを配置するたびに、WordPress はテーマを更新します。
 +
# サイトをプレビューします。「デフォルト」のサイドバーの内容が、新しく追加したウィジェットで置き換わっているはずです。
 +
# 「ウィジェット」画面に戻り、ウィジェットを追加します。
 +
# サイドバー、またはウィジェットエリア内でウィジェットを並べ替えるには、ウィジェットをクリックし、希望の位置へドラッグします。
 +
# ウィジェットの機能をカスタマイズするには、左上隅の下向き矢印をクリックし、ウィジェットインターフェースを開きます。
 +
# ウィジェットのカスタマイズを保存するには「保存」をクリックします。
 +
# ウィジェットを削除するには「削除」をクリックします。
 +
 
 +
ウィジェットを取り除く際に将来使うときのため設定を残しておきたい場合は、そのウィジェットを「使用停止中のウィジェット」エリアにドラックしましょう。これは、ウィジェットエリアの数が種類が違うテーマに変更するときに特に便利です。
 +
 
 +
テーマを変更する場合、ウィジェットエリア・サイドバーの数や位置が異なるため移行がスムーズに行かない場合があります。テーマを変更した際にウィジェットがなくなってしまった場合、画面をスクロールして「使用停止中のウィジェット」で過去に利用した設定が保存済みのウィジェットを見つけてください。
 +
 
 +
表示オプションタブからアクセシビリティモードを有効化することで、ドラッグアンドドロップの代わりに「追加」「編集」ボタンを使うことができます。
  
 
<div id="Widget Areas">
 
<div id="Widget Areas">
===ウィジェットのインストール===
+
===ウィジェットエリア===
 
</div>
 
</div>
  
While widget areas typically occur in webpage sidebars, a theme can place widget areas anywhere on a page. For example, besides the usual sidebar locations, the twentyfourteen theme has a widget area in the footer of every page.
+
ウィジェットエリアは通常 Web ページのサイドバーに位置しますが、テーマはページ内のどの位置にでもウィジェットエリアを配置できます。たとえば [[Twenty Fourteen]] テーマでは通常のサイドバーの位置以外に、すべてのページのフッターにもウィジェットエリアがあります。
  
If you would like to place a Widget somewhere on your Theme that does not have a pre-defined Widget Area, you will need some programming knowledge and should follow the instructions on the [http://codex.wordpress.org/Widgets_API Widgets API] section found [http://codex.wordpress.org/Widgets_API#Displaying_Widgets_and_Widget_Areas here].
+
事前に定義されたウィジェットエリア以外の、テーマ内の任意の場所にウィジェットを配置するにはプログラミングの知識が必要です。「[[Widgets_API|Widgets API]]」の「[[:en:Widgets_API#Displaying_Widgets_and_Widget_Areas|Displaying Widgets and Widget Areas (英文)]]」を参照してください。
  
 
<div id="Using Text Widgets">
 
<div id="Using Text Widgets">
==ウィジェットを使う==
+
==「テキスト」ウィジェットを使う==
 
</div>
 
</div>
  
The Text Widget is one of the most commonly used WordPress Widgets that comes with every WordPress installation. It allows users to add text, video, images, custom lists, and more to their WordPress sites.
+
「テキスト」ウィジェットはもっともよく使用される WordPress ウィジェットの一つで、すべての WordPress インストールに付属します。「テキスト」ウィジェットを使用して WordPress サイトにテキスト、動画、画像、カスタムリストなどを追加できます。
  
To use the WordPress Text Widget:
+
WordPress「テキスト」ウィジェットを使用するには
  
# Go to Themes > Widgets in the WordPress Administration Panels.
+
# 管理画面で '''「外観」> 「カスタマイズ」''' にアクセスし、'''ウィジェット''' をクリックします。または管理画面で '''「外観」> 「ウィジェット」''' にアクセスします。
# Open the sidebar, footer, or Theme section to which you wish to add the Text Widget.
+
# 「テキスト」ウィジェットを追加するサイドバーを開きます。
# Find the Text Widget in the list of Widgets.
+
# 「利用できるウィジェット」リストで「テキスト」ウィジェットを探します。
# Click and drag the Widget to the spot you wish it to appear.
+
# ウィジェットを選択して希望の位置にドラッグします。
  
To open and edit the Text Widget:
+
「テキスト」ウィジェットを開き、編集するには
  
# Click the down arrow to the right of the Text Widget title.
+
# 「テキスト」ウィジェットの右側の下向き矢印をクリックします。
# Set the Text Widget Title (optional).
+
# 「テキスト」ウィジェットのタイトルを入力します(オプション)
# Add the text or HTML code to the box or edit what is currently there.
+
# テキストボックスにテキスト、または HTML を入力するか、既存の内容を編集します。
# Choose the option to '''Automatically add paragraphs''' to wrap each block of text in an HTML paragraph tag (recommended for text).
+
# 「自動的に段落追加する」オプションをオンにすると、テキストの各ブロックが HTML の &lt;p&gt; タグで囲まれます (テキストの場合、推奨)
# Click Save to save the Text Widget.
+
# 「保存」をクリックして、「テキスト」ウィジェットを保存します。
# Click Close to close the Text Widget.
+
# 「閉じる」をクリックして、「テキスト」ウィジェットを閉じます。
# Switch tabs in your browser and preview the results and make changes if necessary.
+
# ブラウザで変更結果を確認し、必要であれば修正します。
  
The Text Widget can hold a variety of HTML, XHTML, and multimedia links and players such as video and object embeds.
+
「テキスト」ウィジェットにはさまざまな HTML、XHTML、マルチメディアリンク、動画や埋め込みオブジェクトのプレイヤーを挿入できます。
  
 
<div id="Styling the Text Widget">
 
<div id="Styling the Text Widget">
77行目: 102行目:
 
</div>
 
</div>
  
Standard image alignment CSS styles such as <tt>alignleft, alignright,</tt> and <tt>aligncenter</tt> apply for images.
+
WordPress「テキスト」ウィジェットの様々なデフォルトスタイルを変更するには、次の例を参照してください。2番目の「テキスト」ウィジェットでは、「自動的に段落追加する」オプションがオンです。
  
To specifically style the various default styles of the WordPress Text Widget, use the following example:
+
<pre><div id="widget-area" class="widget-area" role="complementary">
 
+
<aside id="text-1" class="widget widget_text"><h2 class="widget-title">最初の「テキスト」ウィジェットのウィジェットタイトル</h2>
<pre><div id="primary" class="sidebar">
+
<div class="textwidget">「テキスト」ウィジェットエリア内のテキスト</div>
<ul>
+
</aside>
<li id="text-1" class="widget widget_text"><h3 class="widgettitle">Widget Title for First Text Widget</h3>
+
<aside id="text-2" class="widget widget_text"><h2 class="widget-title">2番目の「テキスト」ウィジェットのウィジェットタイトル</h2>
<div class="textwidget">Text within the text widget area.</div>
+
<div class="textwidget"><p>2番目の「テキスト」ウィジェットエリア内のテキスト</p></div>
</li>
+
</aside>
<li id="text-2" class="widget widget_text"><h3 class="widgettitle">Widget Title for Second Text Widget</h3>
+
</div><!-- .widget-area -->
<div class="textwidget"><p>Text for second widget text area.</p></div>
+
</li>
+
</ul>
+
</div>
+
 
</pre>
 
</pre>
  
97行目: 118行目:
 
</div>
 
</div>
  
Basic HTML, embeds, and JavaScript are added easily to the WordPress Text Widget. Most embed codes from social sharing sites for multimedia will work in a WordPress Text Widget. However, active code and programming languages such as PHP will not work as the Widget will strip out code it cannot display.
+
基本的な HTML、埋め込みオブジェクト、JavaScript は簡単に WordPress「テキスト」ウィジェットへ追加できます。マルチメディアコンテンツのソーシャル共有サイト用埋め込みコードも WordPress「テキスト」ウィジェット内で動作します。ただしアクティブなコードや PHP のようなプログラミング言語は、ウィジェットが表示できないコードを取り除くため動作しません。
  
To add active code to the Text Widget, use one of the many WordPress Plugins from the [http://wordpress.org/extend/plugins/ WordPress Plugin Directory] that override WordPress restrictions on using PHP in posts. Check that they will work on Widgets as some will not.
+
「テキスト」ウィジェットにアクティブなコードを追加するには、[http://ja.wordpress.org/plugins/ WordPress プラグインディレクトリ] から、投稿内での PHP 使用に関する WordPress の制限を上書きする、多くのプラグインのどれかを使用してください。ただしウィジェットでは動作しないものもあるため確認が必要です。
  
 
<div id="Using RSS Widgets">
 
<div id="Using RSS Widgets">
105行目: 126行目:
 
</div>
 
</div>
  
There are two built-in WordPress RSS or Feed Widgets. The '''RSS Links''' displays a list of the links to various core WordPress feeds on your site for Posts and Comments. The '''RSS''' allows you to integrate an external feed source for content into a Widget area of your site, such as your Twitter account, Facebook posts, Google+ posts, or other blogs.
+
「RSS」ウィジェットでは外部のフィードソースからサイトのウィジェットエリアに、Twitter アカウント、Fecebook の投稿、Google+ の投稿、その他のブログなどのコンテンツを統合できます。
  
The '''RSS Links Widget''' offers the option to title the section and choose which type of feeds to offer to visitors to add to their feed reader. This widget does not display feed content, just the links to the feeds.
+
「RSS」ウィジェットはアクティブなフィードを使用して任意のソースで最近公開されたコンテンツを表示します。これはサイトと外部コンテンツを統合する理想的な方法です。
  
# Posts will displays the most recently published content in their feed reader.
+
デフォルトでは WordPress「RSS」ウィジェットは投稿のタイトル、ツイートの最初の 100文字、長いタイトルのない投稿を表示します。表示はフィードのデザインや構造により、リンク形式か、オリジナルのソースへのリンクとなります。
# Comments displays the most recent comments in their feed reader.
+
# Posts and Comments displays a combination of both in their feed reader.
+
  
The visitor will typically click the link to add the feed to their feed reader.
+
# 最初のボックスに サイドバーや他のウィジェット用領域に表示するコンテンツの RSS フィード URL を入力します。RSS フィード URL はコンテンツのソースページからコピーします。
 +
# このフィードにタイトルをつける: オプションです。コンテンツのソースを紹介できます。
 +
#  フィード内の項目をいくつ表示しますか?: デフォルトでは 10件の投稿が表示されますが、1 から 20 の間で指定できます。
 +
# 項目の内容を表示しますか?: タイトル以外にコンテンツの抜粋を表示できます。
 +
#  もしあれば項目の作成者を表示しますか? : オリジナルのコンテンツの作成者を明記する場合は、このオプションをオンにして作者名を表示します。
 +
# 項目の日付を表示しますか?: 可能であれば、コンテンツのオリジナルの日付が表示されます。
  
The '''RSS Widget''' displays the most recently published content from any source with an active feed. This is an ideal way of integrating outside content into your site.
+
WordPress サイトのサイドバーや他のウィジェット領域には、複数の RSS フィード用に複数の「RSS」ウィジェットを追加できます。
 
+
By default, WordPress RSS Widgets display the post title or the first 100 or so characters of a Tweet or long untitled post. These are either in the form of a link or features a link to the original source depending upon the feed's design and structure.
+
 
+
# Enter the RSS feed URL in the first form, copied from the source page for the content you wish to include in your sidebar or other widgetized space.
+
# Give the feed a title: This is optional and gives you the chance to showcase the source of the content.
+
# How many items would you like to display: By default, 10 are show, but you can choose from 1-20 posts.
+
# Display item content?: This allows you to show an excerpt of the content not just the title.
+
# Display item author if available?: If you wish to give credit to the original author of the content, check this to display the author.
+
# Display item date?: If available, the date of the original content will be shown.
+
 
+
You may add multiple RSS Widgets for incoming feeds to your WordPress sidebar and other widgetized areas of your site.
+
  
 
<div id="Resources">
 
<div id="Resources">
132行目: 145行目:
 
</div>
 
</div>
  
*[http://codex.wordpress.org/Widgetizing_Themes Codex:Widgetizing Themes]
+
* [[Widgetizing_Themes|テーマのウィジェット対応]]
*[http://automattic.com/code/widgets/use/ How to Use Widgets] (may document deprecated functions)
+
* [[Widgets API]]
*[http://automattic.com/code/widgets/ WordPress Widgets Download] (may document deprecated functions)
+
* [http://lorelle.wordpress.com/2011/08/23/wordpress-tips-exploring-the-wordpress-text-widget/ WordPress Tips on Exploring the WordPress Text Widget 「テキスト」ウィジェットの使い方]
*[http://svn.wp-plugins.org/widgets/trunk/README.txt svn Widget README.txt]
+
* [http://wordpress.org/development/2006/03/widgets-plugin/ WordPress ウィジェットのアナウンス (歴史的文献)]
*[http://wordpress.org/development/2006/03/widgets-plugin/ WordPress Development Blog Announcement]
+
 
*[http://wordpress.com/blog/2006/02/25/wordpress-widgets/ WordPress Widgets on WordPress.com]
+
*[[Widgets API]]
+
*[http://automattic.com/code/widgets/themes/ Widgetizing Themes] (may document deprecated functions)
+
*[http://automattic.com/code/widgets/plugins/ Widgetizing Plugins] (may document deprecated functions)
+
*[http://lorelle.wordpress.com/2006/03/31/designing-a-theme-to-include-wordpress-widgets/ Designing a Theme to Include WordPress Widgets?]
+
* [http://lorelle.wordpress.com/2011/08/23/wordpress-tips-exploring-the-wordpress-text-widget/ WordPress Tips on Exploring the WordPress Text Widget]
+
*[http://widgets.wordpress.com/ WordPress Widgets at WordPress Widgets Blog] deprecated and not maintained (historical reference)
+
*[http://wordpress.org/extend/plugins/total-widget-control/ Managing Widgets on a Page by Page Basis] (Managing Widgets on a Page by Page Basis)
+
  
{{原文|WordPress_Widgets|153108}} <!-- 2015-08-05T08:35:05‎ Nao 版 -->
+
{{原文|WordPress_Widgets|153607}} <!-- 04:44, 23 August 2015‎ Atachibana版 -->
  
 
[[Category:ウィジェット]]
 
[[Category:ウィジェット]]
152行目: 157行目:
  
 
[[en:WordPress_Widgets]]
 
[[en:WordPress_Widgets]]
 +
[[ja:WordPress_Widgets]]

2015年8月23日 (日) 14:04時点における版

WordPress ウィジェットはサイドバーにコンテンツや機能を追加します。WordPress にはデフォルトで「カテゴリー」「タグクラウド」「検索」などのウィジェットがあります。ウィジェットを追加するプラグインもあります。

もともとウィジェットはユーザーに、WordPress テーマのデザインや構造を管理するシンプルで使いやすい方法を提供する目的で設計されました。現在では適切に「ウィジェット化」された WordPress テーマであれば、ヘッダーやフッターを始め、WordPress デザインや構造の多くでウィジェットを使用します。 ウィジェットにプログラミングの経験やスキルは必要はありません。「テーマカスタマイザー」またはWordPress 管理画面の 「外観」> 「ウィジェット」から追加、削除、並べ替えできます。

カスタマイズをサポートする WordPres ウィジェットでは入力用のフォーム、データや情報の追加と削除、オプションの画像、その他のカスタマイズ機能などのオプションがあります。

管理画面/外観/ウィジェット」では WordPress に同梱されたさまざまなウィジェットの使い方が説明されています。

ウィジェットがバンドルされたプラグインは WordPress プラグインディレクトリで検索できます。

ウィジェットのインストール

WordPress にはさまざまな Glossary#Widget ウィジェット が同梱されていますが、不足の場合は管理画面の 「プラグイン」>「新規追加」 から WordPress プラグインディレクトリ にアクセスし、新しいウィジェットを検索、追加できます。

ウィジェットの表示

既存ウィジェットエリア内の既存ウィジェット

ウィジェットを追加する前に、使用中のテーマがウィジェットをサポートするかどうか、正確には Glossary#Widget_Area ウィジェットエリア をサポートするかどうかを確認する必要があります。と言っても方法は単純で管理画面の「外観」メニューの下に「ウィジェット」サブメニューがあればサポートされています。

テーマが「テーマカスタマイザー」をサポートしていれば次の手順でウィジェットを追加できます。「テーマカスタマイザー」では変更をすぐにプレビューできます。


外観 カスタマイザー ウィジェット画面


  1. 管理画面で 「外観」> 「カスタマイズ」 にアクセスします。
  2. テーマカスタマイザーで ウィジェット をクリックします。ウィジェットカスタマイズ用画面に移動します。
  3. ウィジェットエリア 右側の下向き矢印をクリックします。登録済みのウィジェット一覧が表示されます。
  4. サイドバー下部の「ウィジェットを追加」ボタンをクリックしてください。利用可能なウィジェットの一覧が表示されます。
  5. 追加するウィジェットをクリックしてください。ウィジェットがサイドバーに追加されます。
  6. プレビューで確認します。新しいウィジェットでコンテンツが表示されます。
  7. サイドバー内でウィジェットを並べ替えるには、ウィジェットをドラッグアンドドロップして希望の順番に並べるか、「並べ替え」リンクをクリックして、各ウィジェットの上向き矢印、下向き矢印をクリックし、最後に「完了」をクリックします。
  8. ウィジェットの機能をカスタマイズするには、右側の 下向き矢印 をクリックし、ウィジェットインターフェースを開きます。
  9. ウィジェットを削除するには、上の手順のウィジェットインターフェースで 削除 をクリックします。


テーマが「カスタマイザー」をサポートしていなければ、次の従来の手順でウィジェットを追加できます。


外観 ウィジェット画面


  1. 管理画面で 「外観」> 「ウィジェット」 にアクセスします。
  2. ウィジェットを選択し、サイドバーの希望の位置にドラッグするか、ウィジェットをクリックし、テーマが複数のサイドバーをサポートしている場合はサイドバーを選択し、「ウィジェットを追加」ボタンをクリックします。複数のサイドバーオプションがある場合は、最初のサイドバーから始めてください。ウィジェットを配置するたびに、WordPress はテーマを更新します。
  3. サイトをプレビューします。「デフォルト」のサイドバーの内容が、新しく追加したウィジェットで置き換わっているはずです。
  4. 「ウィジェット」画面に戻り、ウィジェットを追加します。
  5. サイドバー、またはウィジェットエリア内でウィジェットを並べ替えるには、ウィジェットをクリックし、希望の位置へドラッグします。
  6. ウィジェットの機能をカスタマイズするには、左上隅の下向き矢印をクリックし、ウィジェットインターフェースを開きます。
  7. ウィジェットのカスタマイズを保存するには「保存」をクリックします。
  8. ウィジェットを削除するには「削除」をクリックします。

ウィジェットを取り除く際に将来使うときのため設定を残しておきたい場合は、そのウィジェットを「使用停止中のウィジェット」エリアにドラックしましょう。これは、ウィジェットエリアの数が種類が違うテーマに変更するときに特に便利です。

テーマを変更する場合、ウィジェットエリア・サイドバーの数や位置が異なるため移行がスムーズに行かない場合があります。テーマを変更した際にウィジェットがなくなってしまった場合、画面をスクロールして「使用停止中のウィジェット」で過去に利用した設定が保存済みのウィジェットを見つけてください。

表示オプションタブからアクセシビリティモードを有効化することで、ドラッグアンドドロップの代わりに「追加」「編集」ボタンを使うことができます。

ウィジェットエリア

ウィジェットエリアは通常 Web ページのサイドバーに位置しますが、テーマはページ内のどの位置にでもウィジェットエリアを配置できます。たとえば Twenty Fourteen テーマでは通常のサイドバーの位置以外に、すべてのページのフッターにもウィジェットエリアがあります。

事前に定義されたウィジェットエリア以外の、テーマ内の任意の場所にウィジェットを配置するにはプログラミングの知識が必要です。「Widgets API」の「Displaying Widgets and Widget Areas (英文)」を参照してください。

「テキスト」ウィジェットを使う

「テキスト」ウィジェットはもっともよく使用される WordPress ウィジェットの一つで、すべての WordPress インストールに付属します。「テキスト」ウィジェットを使用して WordPress サイトにテキスト、動画、画像、カスタムリストなどを追加できます。

WordPress「テキスト」ウィジェットを使用するには

  1. 管理画面で 「外観」> 「カスタマイズ」 にアクセスし、ウィジェット をクリックします。または管理画面で 「外観」> 「ウィジェット」 にアクセスします。
  2. 「テキスト」ウィジェットを追加するサイドバーを開きます。
  3. 「利用できるウィジェット」リストで「テキスト」ウィジェットを探します。
  4. ウィジェットを選択して希望の位置にドラッグします。

「テキスト」ウィジェットを開き、編集するには

  1. 「テキスト」ウィジェットの右側の下向き矢印をクリックします。
  2. 「テキスト」ウィジェットのタイトルを入力します(オプション)。
  3. テキストボックスにテキスト、または HTML を入力するか、既存の内容を編集します。
  4. 「自動的に段落追加する」オプションをオンにすると、テキストの各ブロックが HTML の <p> タグで囲まれます (テキストの場合、推奨)
  5. 「保存」をクリックして、「テキスト」ウィジェットを保存します。
  6. 「閉じる」をクリックして、「テキスト」ウィジェットを閉じます。
  7. ブラウザで変更結果を確認し、必要であれば修正します。

「テキスト」ウィジェットにはさまざまな HTML、XHTML、マルチメディアリンク、動画や埋め込みオブジェクトのプレイヤーを挿入できます。

テキストウィジェットのスタイル

WordPress「テキスト」ウィジェットの様々なデフォルトスタイルを変更するには、次の例を参照してください。2番目の「テキスト」ウィジェットでは、「自動的に段落追加する」オプションがオンです。

<div id="widget-area" class="widget-area" role="complementary">
	<aside id="text-1" class="widget widget_text"><h2 class="widget-title">最初の「テキスト」ウィジェットのウィジェットタイトル</h2>
		<div class="textwidget">「テキスト」ウィジェットエリア内のテキスト</div>
	</aside>	
	<aside id="text-2" class="widget widget_text"><h2 class="widget-title">2番目の「テキスト」ウィジェットのウィジェットタイトル</h2>			
		<div class="textwidget"><p>2番目の「テキスト」ウィジェットエリア内のテキスト</p></div>
	</aside>			
</div><!-- .widget-area -->

テキストウィジェットにコードを追加する

基本的な HTML、埋め込みオブジェクト、JavaScript は簡単に WordPress「テキスト」ウィジェットへ追加できます。マルチメディアコンテンツのソーシャル共有サイト用埋め込みコードも WordPress「テキスト」ウィジェット内で動作します。ただしアクティブなコードや PHP のようなプログラミング言語は、ウィジェットが表示できないコードを取り除くため動作しません。

「テキスト」ウィジェットにアクティブなコードを追加するには、WordPress プラグインディレクトリ から、投稿内での PHP 使用に関する WordPress の制限を上書きする、多くのプラグインのどれかを使用してください。ただしウィジェットでは動作しないものもあるため確認が必要です。

RSS ウィジェットを使う

「RSS」ウィジェットでは外部のフィードソースからサイトのウィジェットエリアに、Twitter アカウント、Fecebook の投稿、Google+ の投稿、その他のブログなどのコンテンツを統合できます。

「RSS」ウィジェットはアクティブなフィードを使用して任意のソースで最近公開されたコンテンツを表示します。これはサイトと外部コンテンツを統合する理想的な方法です。

デフォルトでは WordPress「RSS」ウィジェットは投稿のタイトル、ツイートの最初の 100文字、長いタイトルのない投稿を表示します。表示はフィードのデザインや構造により、リンク形式か、オリジナルのソースへのリンクとなります。

  1. 最初のボックスに サイドバーや他のウィジェット用領域に表示するコンテンツの RSS フィード URL を入力します。RSS フィード URL はコンテンツのソースページからコピーします。
  2. このフィードにタイトルをつける: オプションです。コンテンツのソースを紹介できます。
  3. フィード内の項目をいくつ表示しますか?: デフォルトでは 10件の投稿が表示されますが、1 から 20 の間で指定できます。
  4. 項目の内容を表示しますか?: タイトル以外にコンテンツの抜粋を表示できます。
  5. もしあれば項目の作成者を表示しますか? : オリジナルのコンテンツの作成者を明記する場合は、このオプションをオンにして作者名を表示します。
  6. 項目の日付を表示しますか?: 可能であれば、コンテンツのオリジナルの日付が表示されます。

WordPress サイトのサイドバーや他のウィジェット領域には、複数の RSS フィード用に複数の「RSS」ウィジェットを追加できます。

リソース


最新英語版: WordPress Codex » WordPress_Widgets最新版との差分