美川の山里暮らし

還暦を過ぎ、岡山県南西部の山間地で文明の利器を活用しながら田舎生活を満喫したいと思っています ウウツボグサの写真

リンクでrel=”external”を使って新ウィンドウに表示させる方法

Filed under: Home Page — タグ: , — daii @ 7:15 AM
2010年6月22日

リンクを新しいウィンドウに表示させるかどうかの問題

ワードプレスではコメントのリンクにrel=”external nofollow”との記述が自動的に入って、このリンクをクリックすると同じウィンドウ内に表示されるようになっています。これを新しいウィンドウに表示したいと思ったら、リンクを右クリックしてメニューから選ぶか、SHIFTかCTRLキーを押しながらリンクをクリックします。

ウェブページでリンクをクリックして、新しいウィンドウ表示するには、普通target=”_blank”を使います。 しかし、この書き方はXHTML (1.0Strictや1.1)には準拠していません。これは、新しいウィンドウを開くかどうかはユーザーが決めるべき問題で、ウェブページ側では決めないという考え方からきています。

でも、全ユーザーが新しいウィンドウで開くやり方を知っているかというと疑問です。やはり外部リンクは新しい窓で開きたいものです。そうしないとまた元のページに戻ってくるのが大変ですし、もう戻ってきてくれないかも知れません。

target=”_blank”を使うと、HTMLの文法チェッカーで検査すると、間違っていると警告が出ることがあります。これを回避するにはJavaScriptを使う方法があります。

JavaScriptを使ってtaget=”_blank”のかわりに rel=”external”を使う方法

それは、HTMLのヘッダーでJavaScriptを読み込ませて、リンクを設置するときにtaget=”_blank”のかわりに、 rel=”external”またはrel=”external nofollow”を使う方法です。

function externalLinks() {
if (!document.getElementsByTagName) return;
var anchors = document.getElementsByTagName("a");
for (var i=0; i
var anchor = anchors[i];
if (anchor.getAttribute("href") &&
((anchor.getAttribute("rel") == "external nofollow") || (anchor.getAttribute("rel") == "nofollow external") || (anchor.getAttribute("rel") == "external")))
anchor.target = "_blank";
}
}
window.onload = externalLinks;

このコードを例えばexternal.jsという名前でドメインルート等に保存し、アップロードします。これを呼び出すには、HTMLヘッダー部で次のように記述します。

<script type="text/javascript" src="http://hogehoge.jp/external.js"></script>

これを使うにはリンク作成時にaタグ内でrel=”external”、または、 rel=”external nofollow” と書くだけです。

でも、自分の書いたコードではこれが適用できますが、広告の中のコードには適用することができません。グーグルや楽天アフィリエイトではコードを書き換えることが禁止されているからです。この方法も自己満足に過ぎませんね。知っていて損はないでしょう。

スポンサーリンク

DOCTYPEより前にコメントを書くとIEで互換モードになります

Filed under: Home Page — タグ: , , — daii @ 6:40 AM
2010年6月15日

昨日、このブログがIE(インターネットエクスプローラー)だけでMax-width の動作がおかしいのに気がつきました。つまり、IE7,IE8でMax-widthが働いていないのです。Firefox と Opera は問題ありませんでした。

スタイルシートのmax-width 付近の記述が間違っているのかと色々やってみましたが全く変わりません。私のホームページの方はうまく表示されているので、該当部分のスタイルシートをコピーしてみましたが変わりません。

ブラウザでソースを表示させてみて、あるいは先頭のコメントかと思い、これを削除したらあっさり直りました。

<!-- begin header -->

ネットで検索してみると次のような記述がありました。

XML 宣言の後に HTML コメントが挿入されている場合、Internet Explorer 8 標準モードとして表示されない

私の場合はコメントがXML 宣言の前でしたのでこの記述は間違っています。XHTML1.0の標準モードに設定しています。

<!-- begin header -->
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

「DOCTYPEより前にコメントを書くとIEで互換モード(Quirks モード)になる」のだと思います。

XML 宣言の後に HTML コメントが挿入されている場合、Internet Explorer 8 標準モードとして表示されない

何時間もこの問題にはまってしまいました。IEはなんとかして欲しいですね。

標準モードと互換モードについて

WordPress設定の覚え書き(xrea,coreserverに設置する)

Filed under: WordPress — タグ: , , , — daii @ 1:56 PM
2010年6月3日

ブログの画像2010年6月3日できるだけシンプルでXHTML文法に忠実なWordPress のテーマ(テンプレートのようなもの)を探していたら、私に誂え向きのテーマ(classic)を見つけました。

Pタグ(段落)の字下げをスタイルシートで設定しました

このWordPressでは投稿時のPタグ(段落)の字下げは無視されるようなので、スタイルシートで字下げを設定しました。これはなかなか良いので、ホームページにも採用しました。つぎのようにPタグにテキストインデント1文字分を追加するだけです。

p	{text-indent: 1em}

サイドバーを右から左に変更しました

この画像ではサイドバーが右にありますが、この方法だと画面の幅を縮めた時、左のメイン部分の一部(画像や広告)がサイドバーの下に隠れてしまいます。そこでサイドバーを左に持ってきました。これなら何の問題も無いでしょう。

ついでにMax Width の設定もやりました。IEやFirefoxやOperaでもうまく表示されているはずですが、どうでしょうか。画面の横幅約910ピクセル以上ではそれ以上に横幅が広がらないはずです。画面の横幅500ピクセル以下でも文章は完全に読めるでしょう。

グーグルアドセンスの広告を付ける

グーグルアドセンスをWordPressに付けるのはなかなか難しいものです。サイドバーにはウィジェットを使えば比較的簡単に広告を付けられますが、メ イン部分には簡単にはいきません。私はヘッダーとフッターに直接コードを貼付けました。アドセンス用のプラグインもあるようですが、貼付け箇所の変更はどうしても必要です。

グーグルアドセンスを付けてもAnother HTML-lint gatewayで文法チェックをしたら99点になりました。普通のブログはマイナス点になるものが多いようです。50点以上ならまず合格でしょう。

Feedburnerとマイブランドとワードプレスの設定方法

Feedburner を使って、マイブランドでのRSS配信をしました。Feedburner のプラグインのFeedSmith も適用してみましたが、WordPressが発行するフィード(http://hogehoge.jp/feed)を使わない設定にすればFeedSmithは必要ありません。

WordPressが発行するフィード(http://hogehoge.jp/feed)を使わない設定にするには、テーマの中のfunctions.php内の

automatic_feed_links();

をコメントアウトします。また、ウィジェットのメタ情報を表示しないようにします。その代わりにリンクの中に「管理者ログイン」というリンクを作って(http://hogehoge.jp/wp-admin/)にリンクさせます。

FeedburnerがWordPressが発行するフィード(http://hogehoge.jp/feed)を(http://feeds.feedburner.com/****)に変換します。このフィードをマイブランドで更に(http://feeds.hogehoge.jp/****)に変換してくれます。これを次のようにヘッドタグ内に記入します。

<link rel="alternate" href="http://feeds.hogehoge.jp/****" type="application/rss+xml" title="RSS" />

サイドバーのアルファベットの表示が小文字になっているのを直しました

サイドバーのアルファベットが大文字になっていても何故か小文字で表示されていました。これは原因がなかなかわかりませんでした。ブラウザで表示させてソースを見ると確かに大文字になっています。 style.css の内容を調べてやっと原因がわかりました。次のようにサイドバー(menu)の文字を小文字に変換するようになっていました。

#menu ul {text-transform: lowercase;}

これを次のように書き換えるか、この項目を削除します。英語圏では小文字で表示させるのが一般的なのでしょうか。

#menu ul {text-transform: none;}

個別記事ページのデザインを変更しました

single.php という名前のファイルを作成すれば個別記事ページを表示するファイルとなるようです。 「index.php」ファイルをコピーしてファイル名を「single.php」にして保存します。内容を次の通り変更します。もちろん、「header.php 」の中に該当の記述がある場合は、 「index.php」内に持ってきます。

個別記事のページではh1タグを個別記事のタイトルにしました。他のページではh1タグはブログの要約を記述していました。後、適当にスタイルシートも変更します。

画像がアップロードできなくなったのを直しました

私はワードプレスをcoreserver.jp で作っています。設定で「アップロードしたファイルを年月ベースのフォルダに整理」にチェックすると、画像がアップロードできなくなりました。

coreserver やxrea はPHPをセーフモードで動かしているらしく、PHPをCGIで動かすように変えてやらないと駄目なようです。「 .htaccess 」 中に

AddHandler application/x-httpd-phpcgi .php

と記入して、 wp-admin の中に入れました。そうしたらアップロードできるようになりました。アップロードファイルだけに適用した方が良いらしいのですが、それだとうまくいきませんでした。

WordPressで管理画面のレイアウトが崩れるときの解決方法(Ver.2.9)

ブログを書いていると突然管理画面のレイアウトがぐちゃぐちゃになってしまいました。どうもスタイルシートがうまく働いていないようです。

この現象はFirefox3で発生して、IE8では問題なく表示されることがわかりました。私はIEの使いにくさにうんざりしていて、すっかり Firefox派になってしまっていたので、できればIEは使いたくないのです。この解決方法は次のようにwp-config.php の上の方に次の行を追加するだけです。

define('CONCATENATE_SCRIPTS',false);

それ以来Firefoxで管理画面を開いても正常に表示されるようになりました。どうもWordPress は不具合が多いようです。

Wp Security Scan を使ってデータベースにアクセス不能になった時の対処

Wp Security Scan のプラグインはとても便利です。セキュリティに無頓着でも一応のセキュリティは確保してくれるみたいです。Wp Security Scan を使うと

Your table prefix should not be wp_. Click here to change it.

と警告してくれます。つまり、データーベースのプリフィックスをデフォルトの wp_ から変更しなさいと言ってきます。セキュリティ上やった方が良さそうなのでやってみました。

wp_のところに新たなprefixを指定して[Start Renaming]をクリックしました。

ブログの閲覧は正常ですが、ログインすると「このページにアクセスするための十分なアクセス権がありません」となってログインできません。原因は変更前のプレフィクス wp_ を使用したデータが、データベース内に存在してしまっているかららしい。

コアサーバーの管理画面から色々やってみましたがどうにもなりません。結局データーベースを全部削除して、新たに同じデータベースを作り直しました。その後バックアップしてあったデーターを戻して終了です。一時はとてもあせりました。疲れました。

WordPressでXML宣言をするとエラーとなります

XHTML1.0では次のようにXML宣言をしますが、WordPress はPHPで記述しています。

<?xml version="1.0" encoding="utf-8"?>

< ? で始まるXML宣言が、PHPを省略して書く際の冒頭部分と同じなのでエラーとなる為です。WordPress のPHPではこの省略を使えないように、WordPress ルートの.htaccessファイルに次の行を書き加えれば問題はありません。

php_flag short_open_tag Off

自動投稿機能、トラックバック送信の不具合を解決する方法

自動投稿機能とトラックバック送信が初期設定だと不具合が生じるのでwp-includesの中のcron.phpの 229行目(Wordpress 2.9の場合)の記述を変更します。

wp_remote_post( $cron_url, array('timeout' => 0.01, 'blocking' => false, 'sslverify' => apply_filters('https_local_ssl_verify', true)) );

この0.01秒を次のように3秒に変更します。

wp_remote_post( $cron_url, array('timeout' => 3, 'blocking' => false, 'sslverify' => apply_filters('https_local_ssl_verify', true)) );
スポンサーリンク

ホームページ作成ソフトをExpression Web3に変えました

Filed under: Home Page — タグ: , , — daii @ 9:10 PM
2009年11月25日

ホームページの作成にはホームページビルダーは便利で使い易いソフトなのですが、ホームページをHTMLからXHTML1.0に書き換えてからは、ホームページビルダーのコードでは、どうにもならないものがあるのに我慢できなくなりマイクロソフトのExpression Web3に変えました。

Expression Webのコードのエラーチェックはすばらしいと思います。エラーがあると赤色系でエラー表示をします。マウスをその上に置くと、そのエラー内容を表示します。私は今まで、コードのエラーチェックはフリーのHTML Project2を使っていましたが、PHPには対応していなくて、常にエラーが出ていました。HTML Project2は他のエラーを見逃したりしていました。

CSSでページをデザインする場合では、自動入力補完機能が実装されているので、私は今まで手打ちでCSSの設定をしていたので、とても使いやすいと思いました。classをクリックして選ぶだけです。

Expression Webはライセンス認証が不要なので、複数のパソコンを持っていれば何台でもインストールが可能です。但し他人と共有は駄目です。あくまでもユーザーライセンスです。

« Newer PostsOlder Posts »

Powered by WordPress