日産が面白いHPを作成していたので紹介します。googleのストリートビューをつなぎ合わせてまるでドライブしているかのような感覚にさせてくれます。少しスピードが早すぎてよってしまうかもしれませんが、疾走感があっていいですね。他にも自転車やラジコンヘリコプターなどで撮影した映像をアップするのも面白そうですね。
【おすすめプラグイン】表の自動作成ツールTablePress
HTMLで表を作成したいことはありませんか。以下のツールを使えば簡単に作成できて背景色なども変えられます。しかも著作権の表示の有無も決められるという優れもの。本当にありがたいツールですね。こちらで全体像を作成して細かいところを編集するなどすると使いやすいと思います。
表の自動作成ツール
サンプル | サンプル |
---|---|
サンプル | サンプル |
サンプル | サンプル |
サンプル | サンプル |
サンプル | サンプル |
サンプル | サンプル |
[html]</pre>
<div style="margin: 0px; padding: 0px;" align="center">
<table style="border-collapse: collapse; border: 1px double #0000ff; background-color: #adde4a; color: #000000; text-align: left; width: 98%;">
<tbody>
<tr>
<th style="border: 1px double #0000ff; background-color: #66ccff; color: #ffffff; text-align: center;"></th>
<th style="border: 1px double #0000ff; background-color: #66ccff; color: #ffffff; text-align: center;"></th>
</tr>
<tr>
<td style="border: 1px double #0000ff; text-align: left;"></td>
<td style="border: 1px double #0000ff; text-align: left;"></td>
</tr>
<tr>
<td style="border: 1px double #0000ff; text-align: left;"></td>
<td style="border: 1px double #0000ff; text-align: left;"></td>
</tr>
<tr>
<td style="border: 1px double #0000ff; text-align: left;"></td>
<td style="border: 1px double #0000ff; text-align: left;"></td>
</tr>
<tr>
<td style="border: 1px double #0000ff; text-align: left;"></td>
<td style="border: 1px double #0000ff; text-align: left;"></td>
</tr>
<tr>
<td style="border: 1px double #0000ff; text-align: left;"></td>
<td style="border: 1px double #0000ff; text-align: left;"></td>
</tr>
</tbody>
</table>
</div>
<pre>
[/html]
HTMLで記述せずとも、ワードプレスではプラグインで簡単に作成できます。
編集画面の「プラグイン」→「新規追加」で「TablePress」を検索してインストール→有効化します
その後「TablePress」→「新しいテーブルを追加」と押して→列と行を指定して「テーブルを追加」
【ワードプレス】完全無料でwordpressでHP制作を開始する方法
wordpress(ワードプレス)でHPを作るとなるとサーバー費用がかかったり広告が表示されたりといったイメージはありませんか?今回は完全無料でwordpress(ワードプレス)でHP制作する方法をご紹介します。
※情報が古い部分があったので2015年7月更新しました。
続きを読む 【ワードプレス】完全無料でwordpressでHP制作を開始する方法
【ワードプレス】サイトマップの作成方法を初心者向けに解説
サイトマップといえば、HP上における地図のようなものですが、 このサイトマップ、実は2種類あるというのはご存知ですか? ひとつはサイトを訪問した人間がHPの全体像を理解したり目的のページを探しやすくするためのもので もうひとつはgoogleやbingの検索エンジンにHPの構造を知らせるためのものです。 またgoogleのweb master tool(ウェブマスターツール)にもFetch as Googleという機能があり ページを追加するたびにすぐに検索エンジンにインデックスさせて、コピーサイトを防止したり 検索に反映させたりすることも重要になります。 さてこれらの少々むつかしくて面倒そうな作業、ワードプレスではプラグインを使えば それぞれ1分で出来ます。非常に簡単でSEO効果も高いので是非とも導入して見てください。
PS Auto Sitemap
こちらは人間用のサイトマップを作成することが出来ます。 プラグインを有効化させたあと、先にサイトマップを表示させる固定ページが投稿ページを作成します。 その後「設定」→「PS Auto Sitemap」と進んで表示させる先を「固定ページ」が「投稿ページ」かを選択し、 「* サイトマップを表示する記事のIDを入力してください。」の所に投稿先のIDを記入して完了です。
Google XML Sitemaps
こちらは検索エンジン用のXML Sitemapsと呼ばれるものを自動生成してくれるすぐれものです。 なんとプラグインを有効化させたあと、「設定」→「google XML Sitemaps」と進んで「XML Sitemaps」を生成すると押せば ワンクリックで完了です。googleやbingにも情報を自動送信してくれるのでしばらく待てば反映されるはずです。 結果はweb master tool(ウェブマスターツール)やSEOチェキなどで確認できます。
PubSubHubbub
こちらも有効化させるだけで記事の更新を検索エンジンに自動送信してくれます。 検索エンジンのクロールは記事の更新頻度やサイト開設からの期間の影響を受けるのである程度サイトが 成熟してきたら記事の更新情報の送信には気を使わなくても大丈夫です。
【アイデアが素晴らしい】テレビCMまとめ
【ワードプレス】投稿名やリンクをカスタムしてSEO対策
みなさんWordPressのパーマリンクはどう設定していますか?
WebサイトのURLの中に任意のキーワードを入れることができます。
検索エンジンの検索対象は、記事の見出しや本文だけでなく、URLの文字列も含まれます。
URLの文字列に任意のキーワードを入れることで、小さなことですがSEO効果を高めることができます。
パーマリンク設定は、デフォルトでは、URLの中に投稿ID(post_id)が入っています。
マナビックではカスタム設定で/%category%/%postname%としています。
カテゴリーIDの下に投稿名が表示される設定ですね。
ただ、このままでは、URLに日本語の文字列が入ってしまいます。
SEO的には日本語で入れても一定の効果があるそうですが、そのURLをSNSなどで拡散したり
貼りつけたりした場合に文字化けが発生してしまうので
SEO用のキーワードを含めた英語の文字列に手動で変更した方がいいでしょう。
もう一つSEO対策する上で意外と知られていない豆知識を紹介します。
リンクを貼る際にリンク先のページを評価したくない場合はありませんか。
rel=nofollow を付けることで評価したくないWebサイトへの外部リンクを評価しないことも可能です。
サインインするボタンやCMS管理画面やECサイトの注文フォーム等、検索エンジンのクローラーが巡回する必要がないページ
アフィリエイト広告等の外部リンクなどはrel=nofollowの設定をしておきましょう。
見本HTML
[html]
<a href="サンプルURL" rel="nofollow">サンプル</a>
[/html]
【ワードプレス】メニューのリンク先を変更する方法
グローバルメニューの中にあるホームボタンのリンク先が以前のサイトのリンク先のままになっていたのを発見したので変更しました。
header.phpなどを触るのかと思ったら、管理画面から簡単に変更できましたのでここに記録しておきます。
「外観」→「メニュー」の「ホーム」の中にリンク先を設定するところがあります。
そこで「ホーム」をおして、URLに任意のものを入力して、
ナビゲーションラベルにリンクの名前を入力します。「ホーム」などでいいと思います。
タイトルの属性はそのままで大丈夫です。
最後に右上のメニューを保存を押して完了です。
【ワードプレス】コメント欄の下の文字修正やコメントの非表示の方法
コメント欄の下の文章を消す
コメント欄の下に
[html]
次のHTML タグと属性が使えます: <a href=”" title=”"> <abbr title=”"> <acronym title=”"> <b> <b lockquote cite=”"> <cite> <code> <del datetime=”"> <em> <i> <q cite=”"> <strike> <strong>
[/html]
というどうみても内部向けの記述があります。こんなのは訪問した人には不要なので、消してしまいましょう。
テーマフォルダの中にある「style.css」の最後に以下のタグを追加
[css]
/* コメント欄の下にある使用できるタグの表記を消す */
.form-allowed-tags{display:none;}
[/css]
コメント欄の下の文章を変更する場合
もしこのコメント欄の下の文章自体を変更したい場合はfunctions.phpを修正する必要がありますが、子テーマでfunctions.phpを編集する時には注意が必要です。functions.php だけは先に子テーマが読み込まれて次に親テーマが読み込まれるので親テーマからそのままコピーするとエラーになります。もし,親テーマと同じ名前の関数が存在するとエラーとなり,画面が表示されなくなってしまう(真っ白になる)んです。ですので子テーマの functions.php は追加する関数だけを書く必要があります。
[php]
<?php
add_filter("comment_form_defaults","my_special_comment_after");
function my_special_comment_after($args){
$args[‘comment_notes_after’] = ‘ここを好きな文字列に変更する。HTMLコードも有効。’;
return $args;
}
?>
[/php]
コメント自体を受け付けない場合
全般的な設定は「設定」→「ディスカッション」で設定出来ます。
投稿ごとや固定ページごとに設定することも出来ます。
まず、ダッシュボードの投稿画面に移動します。
編集したい投稿・固定ページをチェックボックスで選択します。
一括操作というドロップダウンリストから、編集を選択し、適用ボタンをクリックします。
コメント、トラックバック/ピンバック(ブログ投稿のみ)を許可しないに変更して更新をクリック。