WordPress
WikiPediaの情報によれば、世界のWebの43%はWordPressで作られているそうです。オープンなソフトがこれだけのシェアを占めたというのはLinuxと並んで双璧でしょうね。凄いです。
WordPressは、2003年に二人のオープンソースの作者が、当時メイジャーだったMovable Typeを改良するため開発され、その後、2000年代始めのWeb2.0、続くSNSなどインタラクティブなサイト、新たに登場したスマホ中心の世界など相次ぐインタネットの大きな変化に的確に対応してきた結果、Web作成の半分のシェアを持つソフトになったということのようです。
これはWikiPediaの「WWWの歴史」からのグラフです。世界のインターネット上のホスト数は、ご覧のように、1995年のWindows95の登場から増加が始まり、Web2.0の進行に伴ってますます急増。綺麗な放物線を描いて増加しています。
WordPressはこの急速な増大の流れにうまくのってユーザ数を拡大してきたということなのでしょう。僕はこの間、ずっと自前でHTML/CSSを書き、フリーのCGIを使い、自分のサイトを運用してきました。WordPressについては、Webの作成も出来るCMSソフトとして、存在は承知していたのですが、横目で眺めているという感じでした。
最近、同じようなデザインで、スマホ対応するサイトが一杯あるなと気がつき、調べてみたら、多くはWordPressをベースに作成されてるようです。面倒くさそうな(^^;;;CMSソフトが、いつの間にかこんなに跋扈しているとは知らなかった。
世界のCMSのシェアです(出典はこちら)。ご覧のようにWordPressが他のソフトを引き離し、圧倒しています。
これは日本語のWordPressサイトのキャッチフレーズブロックです。
WordPressが、インタネットで情報を公開するための様々なニーズに応えていることが、良く分かります。ホームページとしての情報の公開、ブログ/SNSなど投稿、スマホ/タブレットなどのデバイスへの表示(レスポンシブ対応)、セキュリティの確保、サイトのアクセス状況をとらえるためのSEO機能、リモートでのサイトの更新などインタネットの新しい世界に対する必要十分な対応がされています。
という訳で、最近、WordPressを使い始めました。
インストールは簡単でした。前回このブログで紹介したシンクラウドXfreeにインストールしまた。サーバーパネルからWordPress簡単インストールのメニューを選び、新規インストールのボタンを押す。サイト名などを入力し、実行するだけで、イントールは完了します。
早速、操作パネルから弄ってみました。いいですね。使い方は分かれば簡単。PHPも初めてですが、Webプログラミングには良さそうです。これなら、Web世界を席巻するのも無理はないとと思いました。
ただ、「使い方は『分かれば』簡単」と書きましたが、この『分かれば』という部分が結構大変です。
これはWordPress(日本語版6.4)をインストールし、ログインした時に表示される画面の一部です。
スマホの場合はこんな感じ。
スマホで操作メニューを表示しました。パソコンの画面左側になります。
このメニューを使います。
ブログの投稿であれば、「投稿」ボタンをタップ/クリックし、記事の内容を入力。入力が終わったら公開すればよい。
ホームページの作成であれば、「固定ページ」ボタンをタップ/クリックし、ページの内容を入力。入力が終わったら公開すればよい。
記事/ページのデータは、Gutenbergというブロックエディタを使い、入力する。このエディターの使い方はマニュアルよりこのページの方が分かりやすいです。
インストールしたままであれば、ディフォルトではTwenty Twenty-Four というテーマが指定されているので、そのデザインでページヘッダー/フォター、サイド画面が作成され、入力した内容を含めて表示されます。
デザインを変えたければ「外観」ボタンをタップ/クリックし、好みのデザインのものを選ぶことが出来ます。
また、「プラグインボタン」ボタンをタップ/クリックし、適当なプラグインを設定することで、ブロック編集、セキュリティ、SEOなどの機能を追加することが出来ます。
問題なのはこの辺りの操作方法がWordPressのマニュアルを読んでも良く分からないことです。オープンソース系のソフトに共通する課題ですね。
テクニカルな正確さを重視するあまり、基本的な部分の記述が甘くなり、「何をどうすればいいのかさっぱり分からぬ」ということになっています。
解決策は、トライアル&エラーでいろいろ試してみるか(^^;;;、インタネットでちゃんとした解説をしているサイトを捜すしかないです。
スマホの普及に伴い、物販、旅行、サービス、金融など様々な分野でインタネットを使い、情報提供/取引を行うことが必須となっています。これに伴い、企業や商店が自前のサイトを構築することが当たり前になりました。
先に示した世界のインターネット上のホスト数の急激な増大はこの結果を反映したものです。WordPressはこの分野で使われることにより、シェアを圧倒的に延ばしたのでしょう。
テーマ(外観)やプラグインの多くがこれらの目的で使われるものです。従って、商用のものが大部分です。
この本体はオープンソースであるが、周辺(テーマやプラグイン)は商用ソフトという点が、フリーでWordPressを使う時に、使い方を難しくしている点だと思います。
ビジネスの世界でプロが使うソフトだから、操作方法の丁寧な解説は不要ということです。
WordPressはPHPで作られています。これもプロからみれば有り難い仕組みです。気に入らない部分があれば、簡単に手を入れることが出来るので。
このPHPをどのようにいじり、デザインを変更するか書く予定だったのですが、ここまで書いてようやく本論に入る準備が出来たということになります。先は長そうですね(^^;;;。
Free Web Hosting
このサイトはAwardSpaceというドイツのサーバに置いています。
去年、ボランティアで手伝っている藤沢市パークゴルフ協会のサイトを立ち上げる時ここを見つけ、今年、自分のサイトもAwardSpaceに移行させました。
わざわざ海外のAwardSpaceを使う理由はフリー(無料)で、広告無し、CGI/Perlが使えるホストが日本国内には無かったからです。CGI/Perlにこだわる理由はkentさんのブログと掲示板を動かすためです。
AwardSpaceは2004年に設立され、会社は Germany, Schauenburgerstr. 116, 24118, Kiel ドイツの北側デンマーク近くにあります。キールはドイツ北部の港町です。
会社はドイツのローカルな場所ですが、活動はグローバルでニューヨークやロンドンに連絡先があります。
「Free Web Hosting with CGI and Perl」というこのページを参考にして選びました。この表は良く出来ていると思いますが、上位のサイトはフリーのサービスを停止しているところが多く、結局、使えるのはAwardSpaceだけでした。
AwardSpaceは、
①問題のあるサイトへのリンクを含むページや画像以外のデジタルデータがアップ出来ない、
②多少遅い、
③ディスク要領が最大250MB、
④一月の最大転送要領が5GB、
などという制約はありますが、使い勝手は良く、愛用しています。
さて、ここからが本題です。
藤沢市パークゴルフ協会(FPGA)のサイトですが、2019年からスタートしています。マイクロソフトのホームページ作成ソフトを使っていたました。このソフト、古い設計なので、でレスポンシブ対応(スマホ画面への対応)は出来ないソフトでした。
仕方がないので、htmlとcssを直接書くという方法で対応しました。
こんな感じで、古いサイトの画面をそのままレスポンシブ対応させただけです。従って、古くさい印象になってします。
これが同じトップページのスマホの画面です。確かにレスポンシブ対応され文字は楽に読めるのですが、デザインはいまいちです。
WordPressを使い、気の利いたテーマを選べば、お洒落な画面に出来るとは知ってはいますが、AwardSpaceでWordPressを動かすのは有料なのですよね。
無料のプランがなくて一番安いコースで、月25セントかかる。
この程度、個人だっら払ってしまいますが、金が無い趣味の団体となるとそうはいかない。
しかし、最近、日本のXserverがフリーのWP用スペース(シンクラウドXfreeという)のサービスを提供開始していると知りました。
ここだと広告無しでサイトをおくことが出来、perl/cgiも使えて、更にフリーでWordPressが使えるようです。容量は10GB、転送容量の制限無しと完璧です。
ここに入会するための手続きを案内したページがあります。やってみましたが登録は簡単ですね。
引用した図(ページ)にあるように3カ月置きに契約更新しないといけないのが、ちょっと面倒ですが、まあ仕方がないでしょう。
しかし、無料で広告無しのサーバースペースの人気は高いようで、只今、受け付けは一時的に中断しているようです。
実は僕が登録しようとした時もこの状態で、10月中旬に入会は停止していて、10月末まで待たされました。今回は、再開は12月からということですが、多少伸びるかもしれませんね。無料サーバー割り当てるスペースよりビジネス用の割り当てが優先するでしょうから、仕方がないでしょう。
登録する時に注意する必要があるのは個人事業者や規模の小さな趣味の団体の場合、法人としての資格をもっていないと個人で登録という扱いになることです(有限会社なんか場合はどうなるのですかね?)。FPGAの場合はとりあえず僕が登録したFPGA用のgmailメールアドレスと住所で対応しました。まあ、怪しいことをやるわけでは無いので(^^;;;、問題はありませんが。
FPGAサイトのAwardSpaceからXserverへの移行は2段階で行う予定です。第1段階はAwardSpaceの現行サイトをそのままXserverに持ってくる。その後、第2段階としてWordPress化する。という段取りです。
第1段階はあっさり完了。去年レスポンシブ対応させた時は2カ月近くかかったので、楽でした。html、css、画像などを移行し、kentさんのCGIの動作確認をするのがメインなので、当然ですが。
ちょっと手間取ったのはCGIが扱うデータのサイト内の一部のURLが絶対アドレスで表現されていることでした。Grepの置換機能を使い、手間を省くという作戦で対応しました。
この二段階移行で要注意なのはpublic_htmlフォルダーが以下のような構成をとることです。
public_htmlのrootはWordPressのrootとなり関連のシステムファイルやフォルダーが置かれます。そして、public_htmlのfpgaというフォルダーにAwardSpaceのpublic_html下のフォルダーとファイルが配置されます。
従って、第1段階のトップページは
http://fpga.atwebpages.com/index.html
から
https://cf365555.cloudfree.jp/fpga/index.html
と変わることになります。古いトップページはredirect用のページに入れ換えられます。
cgiの場合はもっとシンプルで
となります。
第2段階のWordPressへの移行は試行錯誤しているところですが、大変ですね。
WordPressはオープンソースでフリーに使えますが、テーマとプラグインはほとんどが有料。金の無い趣味の団体には辛い環境です。html/cssやphpを直接操作すれば、なんとか出来るかなと考え、悪戦苦闘中です。この辺りは次回に。
去年、ボランティアで手伝っている藤沢市パークゴルフ協会のサイトを立ち上げる時ここを見つけ、今年、自分のサイトもAwardSpaceに移行させました。
わざわざ海外のAwardSpaceを使う理由はフリー(無料)で、広告無し、CGI/Perlが使えるホストが日本国内には無かったからです。CGI/Perlにこだわる理由はkentさんのブログと掲示板を動かすためです。
AwardSpaceは2004年に設立され、会社は Germany, Schauenburgerstr. 116, 24118, Kiel ドイツの北側デンマーク近くにあります。キールはドイツ北部の港町です。
会社はドイツのローカルな場所ですが、活動はグローバルでニューヨークやロンドンに連絡先があります。
「Free Web Hosting with CGI and Perl」というこのページを参考にして選びました。この表は良く出来ていると思いますが、上位のサイトはフリーのサービスを停止しているところが多く、結局、使えるのはAwardSpaceだけでした。
AwardSpaceは、
①問題のあるサイトへのリンクを含むページや画像以外のデジタルデータがアップ出来ない、
②多少遅い、
③ディスク要領が最大250MB、
④一月の最大転送要領が5GB、
などという制約はありますが、使い勝手は良く、愛用しています。
さて、ここからが本題です。
藤沢市パークゴルフ協会(FPGA)のサイトですが、2019年からスタートしています。マイクロソフトのホームページ作成ソフトを使っていたました。このソフト、古い設計なので、でレスポンシブ対応(スマホ画面への対応)は出来ないソフトでした。
仕方がないので、htmlとcssを直接書くという方法で対応しました。
こんな感じで、古いサイトの画面をそのままレスポンシブ対応させただけです。従って、古くさい印象になってします。
これが同じトップページのスマホの画面です。確かにレスポンシブ対応され文字は楽に読めるのですが、デザインはいまいちです。
WordPressを使い、気の利いたテーマを選べば、お洒落な画面に出来るとは知ってはいますが、AwardSpaceでWordPressを動かすのは有料なのですよね。
無料のプランがなくて一番安いコースで、月25セントかかる。
この程度、個人だっら払ってしまいますが、金が無い趣味の団体となるとそうはいかない。
しかし、最近、日本のXserverがフリーのWP用スペース(シンクラウドXfreeという)のサービスを提供開始していると知りました。
ここだと広告無しでサイトをおくことが出来、perl/cgiも使えて、更にフリーでWordPressが使えるようです。容量は10GB、転送容量の制限無しと完璧です。
ここに入会するための手続きを案内したページがあります。やってみましたが登録は簡単ですね。
引用した図(ページ)にあるように3カ月置きに契約更新しないといけないのが、ちょっと面倒ですが、まあ仕方がないでしょう。
しかし、無料で広告無しのサーバースペースの人気は高いようで、只今、受け付けは一時的に中断しているようです。
実は僕が登録しようとした時もこの状態で、10月中旬に入会は停止していて、10月末まで待たされました。今回は、再開は12月からということですが、多少伸びるかもしれませんね。無料サーバー割り当てるスペースよりビジネス用の割り当てが優先するでしょうから、仕方がないでしょう。
登録する時に注意する必要があるのは個人事業者や規模の小さな趣味の団体の場合、法人としての資格をもっていないと個人で登録という扱いになることです(有限会社なんか場合はどうなるのですかね?)。FPGAの場合はとりあえず僕が登録したFPGA用のgmailメールアドレスと住所で対応しました。まあ、怪しいことをやるわけでは無いので(^^;;;、問題はありませんが。
FPGAサイトのAwardSpaceからXserverへの移行は2段階で行う予定です。第1段階はAwardSpaceの現行サイトをそのままXserverに持ってくる。その後、第2段階としてWordPress化する。という段取りです。
第1段階はあっさり完了。去年レスポンシブ対応させた時は2カ月近くかかったので、楽でした。html、css、画像などを移行し、kentさんのCGIの動作確認をするのがメインなので、当然ですが。
ちょっと手間取ったのはCGIが扱うデータのサイト内の一部のURLが絶対アドレスで表現されていることでした。Grepの置換機能を使い、手間を省くという作戦で対応しました。
この二段階移行で要注意なのはpublic_htmlフォルダーが以下のような構成をとることです。
public_htmlのrootはWordPressのrootとなり関連のシステムファイルやフォルダーが置かれます。そして、public_htmlのfpgaというフォルダーにAwardSpaceのpublic_html下のフォルダーとファイルが配置されます。
従って、第1段階のトップページは
http://fpga.atwebpages.com/index.html
から
https://cf365555.cloudfree.jp/fpga/index.html
と変わることになります。古いトップページはredirect用のページに入れ換えられます。
＜!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"＞
＜html＞
＜head＞
＜title＞転送＜/title＞
＜meta charset="utf-8"＞
＜meta http-equiv="refresh" content="0;url=https://cf365555.cloudfree.jp/fpga/index.html"＞
＜/head＞
＜body＞
...
＜/body＞
＜/html＞
cgiの場合はもっとシンプルで
#!/usr/bin/perl
print "Location:https://cf365555.cloudfree.jp/fpga/....";
exit;
となります。
第2段階のWordPressへの移行は試行錯誤しているところですが、大変ですね。
WordPressはオープンソースでフリーに使えますが、テーマとプラグインはほとんどが有料。金の無い趣味の団体には辛い環境です。html/cssやphpを直接操作すれば、なんとか出来るかなと考え、悪戦苦闘中です。この辺りは次回に。
CafeLogにタイトル一覧表示を追加(3)
CafeLogの作者の運営するKENT-WEBサイトより。『KENT-WEBはCGI/Perlプログラムを無料で配布する日本最大のサイトです。累計ダウンロード数は380,535,654回。』
その内訳が下図。
やはり掲示板が人気で、ブログをCGIで運用しようとする人はまだ少ないようですね。
もっとも、週間のダウンロードランキングは下記の通りですので、cafeLogが2位、累計では最下位に近くにいたSmartBlogが15位とそれぞれ躍進しています。
CGIの人気が掲示板からブログに移ってきているのですかね。
LinkViewerは累計のダウンロード数は68000弱でCafeLogの3.5倍程度です。意外に多いなぁと思いました。「意外に」という理由は、LinkViewerは10年位前に最後のアップデートがされて、その後まったく手が入っていないらです。CafeLogは今年に入ってもイメージファイルのアップデートに関する機能追加がされています。
実は僕の使っている二つのサーバー環境(AwardSpaceとSakura)で、LinkViewerはそのままでは動きませんでした。お約束の
①パーミッションの指定
②冒頭の行でのperlの在り処の指定
は当然行っていますが、こういうエラーになります。
このエラー上記の①や②をうっかり忘れた時に発生すると承知していましたが、今回は心当たりがありません。さらに不思議なのは LinkViewerの機能拡張版のCOSMO_NAVIも試していたのですが、こちらは問題無く動く。
「差は何だろうか ? 」と思案しました。
COSMO_NAVIの紹介のコメント欄に『スマホ画面に対応したレスポンシブデザイン対応です。』とありました。LinkViewerは見るからに古い画面デザインですから、レスポンシブ対応以前の古いCGIのようです。試しにCGIプログラムソースの文字コードを確認したら、COSMO_NAVIはUTF-8、LinkViewerはS-JISでした。どうもこれが怪しそうだなと考え、LinkViewerの文字コードをUTF-8に変更してみました(ついでに改行コードもLinuxスタイルに)。
やり方は使っているエディター次第ですが、例えばサクラエディターならこんな具合です。
動きました。しかし、まだ奇怪しい。
admin.cgiを起動して表示されるパスワードの入力画面です。
続いて、admin.cgiのデータの処理画面。
完全に文字化けしていますね。ただ、こちらはHTMLのmeta指定がs-jisになっているようだなと推測がつきます。
admin.cgiの一番最後に置かれているHTMLヘッダー作成の関数をチェック。
やっぱりs-jisになっていました。
と変更しました。
何故cgiの文字コードがs-jisだと500番のエラーになるのかの理由は不明です。「レスポンシブ対応でないCGIは動かしてやらない」なんていう変なサーバーがあるとは思えません。
ググってみると「.htaccessでAddDefaultCharset shift_jisを指定すればOK」というような記述がありましたが、これは逆にUTF-8がディフォルトのCafeLogなどを動かすのに問題となりそうです。結局、LinkViewerをUTF-8対応させるしかなさそうです。
まあ、何とか問題は解決しましたが、その後のCGIの変更より、この動かすまでの方が大変でしたね(^^;;;。
「cgi s-jis 動かない 500」で検索してみました。要するにshift_jisは古く、10年位前からUTF-8が標準の世界に変わってしまったということは分かるが、何故shift_jisだとperlのCGIが動かないのかは不明ですね。今回、悪戦苦闘する中、参考にしたサイトをご紹介しておきます。
・2021年に、CGIの文字コードのお話を（Shift-JISのCGIが文字化け）
・kent QA
・さくらサーバーで枯れたCGIを動かそうとするも500エラー
・VPSでShift-jisなどのCGIが文字化けする場合にチェックするべきところ
・Fedoraで自宅サーバー構築 CGIの文字コードについて
その内訳が下図。
やはり掲示板が人気で、ブログをCGIで運用しようとする人はまだ少ないようですね。
もっとも、週間のダウンロードランキングは下記の通りですので、cafeLogが2位、累計では最下位に近くにいたSmartBlogが15位とそれぞれ躍進しています。
CGIの人気が掲示板からブログに移ってきているのですかね。
LinkViewerは累計のダウンロード数は68000弱でCafeLogの3.5倍程度です。意外に多いなぁと思いました。「意外に」という理由は、LinkViewerは10年位前に最後のアップデートがされて、その後まったく手が入っていないらです。CafeLogは今年に入ってもイメージファイルのアップデートに関する機能追加がされています。
実は僕の使っている二つのサーバー環境(AwardSpaceとSakura)で、LinkViewerはそのままでは動きませんでした。お約束の
①パーミッションの指定
②冒頭の行でのperlの在り処の指定
は当然行っていますが、こういうエラーになります。
このエラー上記の①や②をうっかり忘れた時に発生すると承知していましたが、今回は心当たりがありません。さらに不思議なのは LinkViewerの機能拡張版のCOSMO_NAVIも試していたのですが、こちらは問題無く動く。
「差は何だろうか ? 」と思案しました。
COSMO_NAVIの紹介のコメント欄に『スマホ画面に対応したレスポンシブデザイン対応です。』とありました。LinkViewerは見るからに古い画面デザインですから、レスポンシブ対応以前の古いCGIのようです。試しにCGIプログラムソースの文字コードを確認したら、COSMO_NAVIはUTF-8、LinkViewerはS-JISでした。どうもこれが怪しそうだなと考え、LinkViewerの文字コードをUTF-8に変更してみました(ついでに改行コードもLinuxスタイルに)。
やり方は使っているエディター次第ですが、例えばサクラエディターならこんな具合です。
動きました。しかし、まだ奇怪しい。
admin.cgiを起動して表示されるパスワードの入力画面です。
続いて、admin.cgiのデータの処理画面。
完全に文字化けしていますね。ただ、こちらはHTMLのmeta指定がs-jisになっているようだなと推測がつきます。
admin.cgiの一番最後に置かれているHTMLヘッダー作成の関数をチェック。
#-----------------------------------------------------------
# HTMLヘッダー
#-----------------------------------------------------------
sub header {
my $ttl = shift;
print "Content-type: text/html\n\n";
print <＜html＞
＜head＞
＜meta http-equiv="content-type" content="text/html; charset=shift_jis"＞
＜meta http-equiv="content-style-type" content="text/css"＞
＜style type="text/css"＞
やっぱりs-jisになっていました。
＜meta http-equiv="content-type" content="text/html; charset=UTF-8"＞
と変更しました。
何故cgiの文字コードがs-jisだと500番のエラーになるのかの理由は不明です。「レスポンシブ対応でないCGIは動かしてやらない」なんていう変なサーバーがあるとは思えません。
ググってみると「.htaccessでAddDefaultCharset shift_jisを指定すればOK」というような記述がありましたが、これは逆にUTF-8がディフォルトのCafeLogなどを動かすのに問題となりそうです。結局、LinkViewerをUTF-8対応させるしかなさそうです。
まあ、何とか問題は解決しましたが、その後のCGIの変更より、この動かすまでの方が大変でしたね(^^;;;。
「cgi s-jis 動かない 500」で検索してみました。要するにshift_jisは古く、10年位前からUTF-8が標準の世界に変わってしまったということは分かるが、何故shift_jisだとperlのCGIが動かないのかは不明ですね。今回、悪戦苦闘する中、参考にしたサイトをご紹介しておきます。
・2021年に、CGIの文字コードのお話を（Shift-JISのCGIが文字化け）
・kent QA
・さくらサーバーで枯れたCGIを動かそうとするも500エラー
・VPSでShift-jisなどのCGIが文字化けする場合にチェックするべきところ
・Fedoraで自宅サーバー構築 CGIの文字コードについて
