新着WEB関連エントリー一覧

MW WP Formで完了画面まで表示されてメール送信できないとき。

WordPressプラグインのMW WP Formで完了画面で「エラーが発生しました。後ほどもう一度お試しください。」と表示されて、メール送信が確認できないときの対応について。

■行ったこと

1.MW WP Formの送信内容にformタグが含まれていないか確認。
2.自動送信メール設定と管理者宛メール設定の送信元、件名、本文をすべて直接入力

上記で修正すると無事送信完了。

送信元(E-mailアドレス)に未入力の場合は・・・と管理用アドレスが自動入力されるような記述があるが、ここが原因とみられる。
直接入力することで別途プラグインなどは必要なさそう。

■反省点
原因の切り分けがすぐにできると考えて、設置した本ページのまま原因を探そうとして、結局、簡単な確認用のフォームを作成して各メール設定の項目を入力したところすぐに原因が判明したので、横着をしないで最初から原因を切り分ける確認用のフォームを作成すべてきでした。

WordPressのファイルの更新でソースコードが消える現象を解決する方法

Web制作の工程でテーマファイルPHP編集で、ファイルサイズが0バイトになる状況の回避が必要になったので、ワードプレスのテーマファイルPHP編集のファイルサイズが0バイトになる状況を解決してみます。

 

はじめの手順としては、まず状況とエラーの確認をします。

WordPress4.9ダッシュボードからテーマファイルのPHPの編集を行い、しばらく更新が反映されずに、『致命的なエラーをチェックするためにサイトと通信できないため、PHP の変更は取り消されました。』と表示されるようになったことを確認します。

 

 

その次に、ファイルサイズとソースコードのチェックをします。

更新がしばらくたって完了すると、更新したテーマファイルのPHP内のソースコードはすべて消去され、FTP接続でファイルを確認すると対象ファイルが0kbyteになっていることを確認をします。

 

最後の手順としてはプラグインをすべて停止で、

WordPress4.9のアップデートのみで上記の症状が出た場合、プラグインをすべて停止させて、再度、テーマファイルPHPを更新して、スムーズに更新されれば、あとは新しいプラグインから有効にして、原因となるプラグインを突き止め停止。という方法で完了します。

 

 

この手順の流れで気を付けたい事が、テーマファイルは必ず定期的にバックアップを保存しておくことと、プラグインは場合によってはWordPress4.9ではそのまま継続使用できなくなる場合がある。またFTPダウンロードで直接編集だと問題が起きない場合があること。この例ではスケジュール管理プラグインのAttendance Managerを停止することで問題が解決したが、複数のプラグインが影響している場合があるという点について注意する必要があります。

XserverでサブドメインのFTP接続を設定する方法

Web制作の工程でサブドメインのみで、FTP接続アカウントの設定が必要になったので、XサーバーのサブドメインのみのFTP接続アカウントを設定してみます。

 

はじめに最初の手順としては、まずFTPアカウントの追加をします。

サーバーパネルのFTPアカウント設定からFTPアカウントを追加します。

 

 

その次に、FTPユーザーIDの作成をします。

FTPユーザーIDはサブドメインの入ったIDで作成するとわかりやすい。接続先ディレクトリは/home/アカウント名/ドメイン名/public_html/サブドメインのディレクトリ名/で設定をします。

 

 

最後の手順としては接続確認で、

作成したサブドメイン用のFTPアカウントで接続を確認。という方法で完了します。

 

 

この手順の流れで気を付けたい事が、接続先のホストは、親のドメインでもサブドメインでもどちらでも設定が可能であることという点について注意する必要があります。

PHPで送信フォームの値が取得できない状態を解決する方法

Web制作の工程でform送信で、送信データがクリアの解決が必要になったので、PHP記述のform送信の送信データがクリアを解決してみます。

 

はじめに最初の手順としては、まずデータ送信の確認をします。

formタグ属性のmethod=””get””として、送信先のURLの引数にデータが付属しているかを確認します。

 

 

その次に、変数値での確認をします。

formタグのactionで指定したページが表示されたら、送信後のページにecho ($_POST[‘test_data’]);でデータが取得できているかを確認をします。

 

 

最後の手順としてはaction属性のURLを確認で、

phpとデータ送信に問題がない場合は、送信値がきちんと変数で受け渡されていないか、いちど送信データがクリアされているので、action属性のURLに拡張子がついていない場合は末にバックスラッシュ/をつける。

という方法で完了します。

 

 

この手順の流れで気を付けたい事が、Apacheの場合は仕様でmod_dirという標準モジュールの機能で、一度末尾無しのディレクトリを参照したのちに、再度バックスラッシュを付属してURLを再表示されているため、一度送信データがクリアされて表示されているのでデータが取得できないという点について注意する必要があります。

WordPressマルチサイト設定方法

以前はブログ型オープンソースCMS『WordPress』は、マルチサイト(ひとつのインストールで複数のWordPressが使用)が実現できませんでした。

しかし、WordPress 3.0から、WordPress MUを使用して実現可能であったWordPressで複数ブログの管理運営機能(マルチサイト機能)が統合されています。

マルチサイト機能を利用する方法は、以下の通り。

 

1.インストール直後の初期設定のみ状態でwp-config.phpファイルに以下の一行を追加します。

define(‘WP_ALLOW_MULTISITE’, true);

2.管理画面の『ツール』項目から、『ネットワーク』をクリックし、
マルチサイトの増やし方、サブディレクトリもしくはサブドメイン方式を選択。

3.必須ではないが、wp-config.php と .htaccess の2つのファイルをバックアップしておく

4.レンタルサーバーxserverの場合:/home/アカウント名など/ドメイン.com/public_html/wp-content の中に blogs.dir ディレクトリを作成。このディレクトリは、追加サイトのメディアアップロードの保存用に使用されるので、ウェブサーバー書き込みの許可設定をしておく。

5./home/アカウント名など/ドメイン.com/public_html/ にある wp-config.php ファイルの、

 

/* 編集が必要なのはここまでです ! WordPress でブログをお楽しみください。 */

という行より上に以下のコードを追加。

define( ‘MULTISITE’, true );
define( ‘SUBDOMAIN_INSTALL’, false );
$base = ‘/’;
define( ‘DOMAIN_CURRENT_SITE’, ‘ドメイン.com’ );
define( ‘PATH_CURRENT_SITE’, ‘/’ );
define( ‘SITE_ID_CURRENT_SITE’, 1 );
define( ‘BLOG_ID_CURRENT_SITE’, 1 );

 

『認証用ユニークキーが wp-config.php にありません。 インストールをさらに安全にするため、次を追加するとよいでしょう。』
の項目内の記述も上記に追加しておいた方がよいようです。

6./home/アカウント名など/ドメイン.com/public_html/ の .htaccess ファイル下記を追加し、WordPress設定のルールを変更します。

RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ – [L]

# uploaded files
RewriteRule ^([_0-9a-zA-Z-]+/)?files/(.+) wp-includes/ms-files.php?file=$2 [L]

# add a trailing slash to /wp-admin
RewriteRule ^([_0-9a-zA-Z-]+/)?wp-admin$ $1wp-admin/ [R=301,L]

RewriteCond %{REQUEST_FILENAME} -f [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ – [L]
RewriteRule ^([_0-9a-zA-Z-]+/)?(wp-(content|admin|includes).*) $2 [L]
RewriteRule ^([_0-9a-zA-Z-]+/)?(.*\.php)$ $2 [L]
RewriteRule . index.php [L]

7.上記ステップの完了後にログインし直すと、ネットワークの有効化設定が反映されます。

ただし同一DBによる管理のため、動作が重くなったり、ダッシュボードに不具合が発生したり、プラグインが非対応だったりと、アップデートなどによるWordpressの更新を行うと思いもよらないバグなどに遭遇するためマルチサイトの採用には注意が必要です。

クロスドメインでiframeをカスタマイズする時に注意したいこと

外部ドメイン制作にかかわる工程でiframeタグ内を編集時に注意したい点について紹介しています。

 

はじめ注意点としては、まずクロスドメインでのiframeになります。

基本的に外部ドメインのWebページなどをiframeで読み込んだ場合、CSS編集やJavascriptなどの制御は一切できないことがあります。

 

 

その次の注意点は、同じドメイン下の場合になります。

同じドメイン下や特別な設定がされているサーバードメイン間でのデザイン編集やCSS,HTMLの編集はJavaScriptなどで修正や変更することは可能があります。

 

 

 

以上のようなことが今回の記事内容についての注意点です。

 

今回の補足注意点としては、そもそも外部HTMLページを読み込んでカスタマイズできる場合は、セキュリティ上はきわめて危険であるため、クロスドメイン下で読み込んだiframe内のカスタマイズはもともと絶対にできないと判断しておくという点について注意しておくとよいでしょう。

ファイル操作でFTPサーバーの削除できないファイルを削除する方法

Web制作の工程でFTP接続で、ファイルが削除できない現象の解決が必要になったので、Webファイル管理のFTP接続のファイルが削除できない現象を削除してみます。

 

はじめに最初の手順としては、まずファイルWeb管理での確認をします。

FTPサーバー接続でファイル名文字化けなどで削除できない場合、レンタルサーバーのファイル管理サービスがあればWebファイル管理システムから削除します。

 

その次に、FTP接続の文字コードを変更をします。

ファイル管理から削除できない場合は、FTP接続で文字コードを指定して再接続する。ShiftJISならUTF-8に強制的に指定し接続する。文字化けしたファイル名の拡張子がでていれば、ファイル名を半角英数字にリネームし削除をします。

 

 

この手順の流れで気を付けたい事が、拡張子が表示されていない文字化けの場合、ファイルが存在するのにFTPサーバでは管理できない存在しない幽霊ファイルとなるため、一切のファイル操作ができなくなる事という点について注意する必要があります。

iPhoneでinputボタンのCSSを有効化する方法

Web制作の工程で送信フォームで、ボタンCSSの有効化が必要になったので、スマホサイトの送信フォームのボタンCSSを有効化してみます。

 

 

はじめに最初の手順としては、まずスマホ閲覧時フォーム確認をします。

スマートフォンでは送信フォームのボタンなどのパーツCSSは、独自のものが優先して表示されるため、コード化時のデザインが正常に表示されているかを確認します。

 

 

その次に、指定セレクタを特定をします。

iPhoneなどでボタンパーツのCSS装飾がうまく反映されていない場合は、端末ブラウザのCSSが優先されているので、HTMLコーディング時にパーツに指定したCSSセレクタを特定をします。

 

 

最後の手順としてはベンダープレフィックスの無効化で、

セレクタを特定できたら、プロパティに以下を追加。

-webkit-appearance: none;

これはブラウザが先行で付けた見栄えの指定を無効にする記述でiPhoneなどで有効。という方法で完了します。

 

 

この手順の流れで気を付けたい事が、個別にプロパティ指定しても、CSS反映の優先度があるのですべてが優先されてしまう場合は、一度ベンダープレフィックスの無効化(リセット)をする必要があるという点について注意する必要があります。

AndroidでGooglePlayの保護者による使用制限を設定する情報

Web制作のAndroid端末にかかわる内容で、保護者による使用制限について設定手順を情報として記録しておいた方が良いと考えたので、GooglePlayアカウント保護者による使用制限のことについて解説しています。

 

》ひとつめの情報-13 歳以上のファミリー メンバーの設定方法。

1.保護者による使用制限を設定する端末で、Play ストア アプリ Google Play を起動します。
2.左上のメニュー アイコン メニュー 次へ [設定] 次へ [保護者による使用制限] をタップします。
3.[保護者による使用制限] をオンにします。
4.PIN を作成します。PIN を作成することで、PIN を知らないユーザーが保護者による使用制限の設定を変更できないようにします。お子様の端末に保護者による使用制限を設定する場合は、お子様にわからない PIN を作成してください。
5.制限するコンテンツの種類をタップします。
6.アクセス制限の方法を選択します。という事があります。

 

》ふたつめの情報-13 歳未満のお子様に Google アカウントの場合。

1.ファミリー リンク アプリ Family Link を起動します。
2.お子様を選択します。
3.[設定] カードで [設定を管理] 次へ [Google Play での使用制限] をタップします。
4.制限するコンテンツの種類をタップします。
5.アクセス制限の方法を選択します。という事があります。

 

その他の情報については、保護設定の細かい年齢制限ごとにアップデートなどが出来なくなるアプリやゲームがあることがあります。

CSSflexboxのimg画像下余白を消去する方法

Web制作の工程でレイアウトモジュールflexboxで、イメージ画像したの空白の編集が必要になったので、CSS3のレイアウトモジュールflexboxのイメージ画像したの空白を消去してみます。

はじめに最初の手順としては、まずCSSセレクタ指定をします。

余白が出ているimgタグの親要素タグにCSSセレクタを指定
ここではclass=””del_img_pad””と指定します。

 

その次に、確認用の背景色指定をします。

imgタグの余白をわかりやすくするために親タグのセレクタに背景色赤を指定
.del_img_pad{
background:red;}をします。

最後の手順としては表示確認と背景色の消去で、

さらにCSSプロパティと値をvertical-align: bottom;で指定し表示確認後、余白が消えていたらbackground:redを削除
.del_img_pad{
vertical-align: bottom;}。という方法で完了します。

 

この手順の流れで気を付けたい事が、ブラウザのバグによる余白の隙間がでるのでfont-size:0でも対処可能だが他のフォント表示に影響等があるためvertical-align: bottom;での設定を推奨という点について注意する必要があります。

DreamWeaver設定情報のサイトの管理をバックアップする方法

Web制作の工程でファイル管理-サイト定義で、サイトの管理データすべてのデータ保存が必要になったので、ドリームウィーバーのファイル管理-サイト定義のサイトの管理データすべてをバックアップしてみます。

 

はじめに最初の手順としては、まずレジストリエディター起動をします。

コマンドラインからレジストリエディターを起動して『コンピューター\HKEY_CURRENT_USER\Software\Adobe\Common\バージョン\Sites』を表示します。

 

その次に、レジストリデータのエクスポートをします。

該当するレジストリのフォルダをエクスポートし保存したい場所に保存をします。

 

最後の手順としてはバックアップの完了で、

レジストリデーターを保存して、レジストリエディターを終了したらデータ保存の完了。という方法で完了します。

 

 

この手順の流れで気を付けたい事が、一度、DreamWeaverのサイトの管理から必要のないサイト定義を削除して、レジストリエディターでバックアップデータをインポートして復元できたら、バックアップが正常にできているのを確認した方がよいという点について注意する必要があります。

Outlook2007でメールアカウントのバックアップをする方法に関する情報

Web制作のOffice Outlook2007にかかわる内容で、バックアップ保存について方法に関する事を情報として記録しておいた方が良いと考えたので、電子メールアカウントバックアップのことについて解説しています。

 

》ひとつめの情報-バックアップ保存機能。

結論からいうとOutlook2007ではメールアカウント設定をバックアップしたりエクスポートする機能は非対応という事があります。

 

 

》ふたつめの情報-非公式な方法。

HKEY_CURRENT_USER\Software\Microsoft\Windows NT\CurrentVersion\Windows Messaging Subsystem\Profiles\Outlookのレジストリ情報をバックアップ保存という事があります。

 

》みっつめの情報-その他。

ジャストシステム 手裏剣などのメールソフトを利用して、設定を吸い出して改めてバックアップ保存する方法などがあるとの事という事があります。

 

 

その他の情報については、Outlook2007以前のバージョンではアカウント情報のバックアップ機能が実装されているということがあります。

SEOやめた結果こうなった

Webサイトやページコンテンツ制作時には、どうしても無意識的に

検索エンジンに対してどうだろうか?

評価されるだろうか?

みたいなことばかり気にして文言や情報の設計をほぼ無意識にしていたので、TOPページのアクセスよりも各ページ単位でのアクセスが多いWebサイトを、思い切ってUI中心のWebサイトに作り変えてみました。

 

そもそも、検索エンジンを念頭に文字を不自然に配置したり伝達したいことを歪曲したりする習慣がついていたことにとても違和感があり、むやみに文章を増やしたりして、なんら疑いを持たずに従属していることに疑問がありました。

SEOを考えてWebコンテンツを作らされることに嫌悪感を覚えていたので、検索エンジンの評価を無視してUIのみを意識してリニューアルしてみたのでした。

そう、SEOを捨ててみた。

 

結果、しばらくするとGoogleではTOPページのインデックスは外されほぼ圏外に。

また、それまで1000ページぐらいウェブマスターツールでインデックスされていたのが700ページ以上解除されている。

盲従しているひとだと軽いパニックになるかもしれませんが、冷静に考えると全体のアクセス数などはその後もあまりかわらず、結果としてウェブマスターツールアカウントを削除したらなんかすっきりした。

そして中途半端にSEOを意識するぐらいなら、アナリティクスなんて見るのも時間の無駄だったと痛感しました。Jetpackでおおよその解析はできるし。

そもそもSEOにかける時間や資源がないWebサイトなどに、アクセスやUUが増えた減ったを見てもほとんど有効な施策はできないし。

ちなみにBingではしっかり上位表示がキープされていました。

SEOで労力対効果を考えた場合、Googleの場合は徒労に終わる(わりにあわない)キーワードも多いから、イメージ通りのコンテンツを制作して流入はすくなくなるもののBingからの確度の高いアクセスを中心にWebコンテンツ展開するのも、ひとつの考え方じゃないかと再考しました。

 

 

 

WordPressプラグインのRedirectionsを設定する方法

Web制作の工程でプラグイン機能で、リダイレクトの設置が必要になったので、ワードプレスのプラグイン機能のリダイレクトを設定してみます。

 

はじめに最初の手順としては、まず新規インストールをします。

ダッシュボードのプラグイン、新規追加からRedirectionと検索してプラグインが出てきたら、インストールして有効化します。

 

 

その次に、プラグインの設置をします。

ダッシュボードのツールから、設定画面を表示させて、リダイレクトの設定を行う。全ページリダイレクトの場合は、ワイルドカードを利用した正規表現チェックを入れ、/(.*)$とURL/$1と設定することで全ページのリダイレクトが可能をします。

 

 

最後の手順としては表示確認で、

Webサイトの表示で以前のページから希望するページにリダイレクトされることを確認。という方法で完了します。

 

 

この手順の流れで気を付けたい事が、設定順番や設定のキャッシュが残る場合があるので、新しいリダイレクト設定時は、キャッシュクリアが必須という点について注意する必要があります。

WordPressプラグインのGoogle Language Translatorを設定する方法

Web制作の工程でプラグイン機能で、自動翻訳機能の設置が必要になったので、ワードプレスのプラグインの自動翻訳機能を設定してみます。

 

はじめに最初の手順としては、まず新規インストールをします。

ダッシュボードのプラグイン、新規追加からGoogle Language Translatorと検索してプラグインが出てきたら、インストールして有効化します。

 

その次に、プラグインの設置をします。

ダッシュボードのウィジェットから、プラグインを追加設定をします。

 

最後の手順としては表示確認で、

設定からプラグインの言語設定がjapaneaseであることを確認しWebサイトの表示を確認。という方法で完了します。

 

この手順の流れで気を付けたい事が、トラフィックブロックのアドオンなどでGoogle翻訳の制限をしていると正常に表示されないという点について注意する必要があります。

CSSでプロパティ値の%、em、remを違いを理解する情報

Web制作のCSS(カスケードスタイルシート)にかかわる工程で、パーセントやemまたはrem指定についてそれぞれの相違点を情報として記録しておいた方が良いと考えたので、プロパティ値%、em、remの違いを理解することについて解説しています。

 

》ひとつめの情報-%(パーセント)。

親タグ要素のフォントサイズを相対的に参照。指定がない場合はデフォルトで16px=100%でサイズ指定という特徴があります。

 

 

》ふたつめの情報-em(エム)。

文字の高さを1emとして親タグ要素のフォントサイズを相対的に参照。%とほぼ同義でデフォルトでは16px=1emでサイズ指定という特徴があります。

 

 

》みっつめの情報-rem(root em)。

CSS3から実装された値で絶対的にrootタグであるhtmlの指定していされた値を参照。デフォルトでは16px=1remでサイズ指定という特徴があります。

 

 

その他の情報については、emやremは小数点以下が換算しずらくなるので、参照親要素の指定値を62.5%とすることで1em=10pxなどに暗算しやすくなるが、煩雑になるだけなのであまり推奨できない点という特徴があります。

WordPressでテーマを導入する時に注意したいこと

オープンソースCMSのワードプレス制作にかかわる工程で有料・無料のテンプレートを利用時に注意したい点について紹介しています。

 

はじめ注意点としては、まずデザインとテーマのマッチングになります。

イメージするWebサイトのデザインイメージと導入したいテーマファイルのレイアウトやデザイントーンが似ていること。大きくレイアウトなどが違っていると編集にとても手間がかかる事があります。

 

 

その次の注意点は、情報配置とテーマの構造になります。

コンテンツの情報配置のレイアウトとテーマファイルのデザインがあまり異なっていると、内部のレイアウト編集やコーディングによっては、レイアウト崩れやデザイン崩れの原因になる事があります。

 

 

最後の注意点としては機能仕様とテーマ特長になります。

WordPressはプラグインなどを利用することで様々な追加機能を実装することができますが、反面テーマファイルのカスタマイズが必要になります。有料のテーマテンプレートには、JavaScriptやPHPで簡易的なプログラムが組み込まれているので、カスタマイズにとても費用や時間がかかる場合がある事があります。

 

以上のようなことが今回の記事内容についての注意点です。

 

今回の補足注意点としては、見た目がかっこいい手頃な価格の有償テーマ購入後、編集やカスタマイズができなくなる場合があり、結局余計な費用がかかる場合がある事という点について注意しておくとよいでしょう。