ウェブデザイナーの問題解決メモ

 wordpressで社内ドキュメント管理システムを構築することになり、見た目や機能が綺麗な「Document Library Pro」を導入することにしました。 「Document Library Lite」はwordpressのプラグイン検索で見つけられます。 これでも十分機能としてはいいのですが、フォルダ階層と、そこに属したファイルをテーブルで表示する仕組みを利用してくて、Proを導入しました。 しかし、完全英語版であり、細かな設定項目をいちいち頭の中で翻訳しながら（またはgoogle翻訳に頼りながら）設定するのは面倒なのと、「Dodument」一覧を表示したときに管理画面で横に広がった見にくいテーブルが許せなくて、日本語化する方法を探しました。 そして、公式サイトで他の言語を作る方法を発見。 https://barn2.com/kb/translating-document-library-pro/ それに従い、独自で日本語化することに…。 元から入っている言語ファイル「」を、 PoEdit というフリーソフトを使って地道に翻訳。 最後にpoからmoへ書き出し、フォルダに突っ込む。 全項目を頑張って日本語化したが、多言語対応していない箇所があってものすごく残念。 だが、一応それっぽくはなったので日本語化ファイルと日本語化の方法を記載します。 自力でやってみたい方向け【自力日本語化の流れ】 1.「ルートディレクトリ/wp-content/plugins/document-library-pro/languages/document-library-pro-nl_NL.po」のファイルを複製 2.公式サイトには「nl_NL」の部分を言語名に変えろとのことだったが、試したところ「ja」だけで表示された。つまり「document-library-pro-ja.po」とする。 3.PoEditで英語に対応する日本語を地道に入力 4.mo形式にして保存 5.元の言語が入っていたところと同じ場所へイン！ 6.wordpress管理画面にアクセス→日本語化！ 自力は面倒だからファイルよこせな方向け【ファイル入れるだけ日本語化の方法】 1.私が作った「 document-library-pro-ja.mo 」を「ルートディレクトリ/wp-content/plugins...

 テンプレート変数を作って、mm_rulesでリソース画面に入力エリアを複数作ったのだが、tinymceが使えるのは「本文」のコンテンツのみ。 これではせっかく管理画面を誰でも入力可能な感じにカスタマイズしたのに、「ここはテキストの装飾できないの？」ということになる。 そこで、 「エレメント」→「エレメント管理」→「プラグイン」のtinymceを選択 「設定」タブの「Custom Parameters」のエリアに以下を追記。 mode : "specific_textareas", selector : "textarea" こうすると、管理画面上で「textarea」になっているテンプレート変数の入力画面が全てtinumceで操作可能になる！

 modxをtinymceでエディタ編集している際、改行をすると勝手にpタグが入ったり、プレビューするとbr改行タグが消えたりする。 また、チャンクで作成したテンプレートを挿入した際には、例えばh2タグの中身を編集していて改行キーを押したときにh2タグ内で改行されて、カーソルをタグ外でクリックしても出てくれない事象が発生する。 wordpressやtinymce本体の使い方はサイトに多くのっているが、modxでの変更方法がなかなか載っていなかったのでメモ。 「エレメント」→「エレメント管理」 tinymceのプラグインを選択 「設定」タブの「プラグインの設定」のエリアに以下を記載 forced_root_block : 'div', force_br_newlines : true, force_p_newlines : false （一番下にカンマは付けません） これが何をやっている設定かというと、 ・新しく文章を入力する際のブロックはdivで囲みます。 →これがないと、改行したときにh2タグ外へ出てくれない ・brを消さない ・pタグを追加させない root_blockに''で空を入れるだけだと、 チャンクテンプレートで<br>タグを最後に入れても何故かbrタグが消える。 <br>タグを<br><br>にしておくと何故か消えないが、改行した際に2こめの<br>タグが文末にどんどん増えていく。 という不思議な動きをする。 なので。div自体には特殊なcssを設定せず、とにかく改行ごとにdivで囲ってしまおうという強硬手段。 どうしてもdivタグで囲いたくない場合は、root_blockを''にして、テンプレート側に<br><br>を設定。 そして追加されていく<br>を手動で消していく感じになる。 もっといい解決方法があったら教えて！！！ ■追記■ やはり、root_blockは''にしないとだめだ。 そしてチャンクテンプレートがh2やdivで囲っているデザインの場合は最後に<br><br>を入れる。 先ほどのやり方だと改行キーを押したら今いるdivが複製されるようになっている！？ ...

 お名前.comのドメイン＆レンタルサーバーを利用していたが、エックスサーバーにサーバーのみ移管することになり、wordpressを移行完了。 メールフォームの送信テストをすると「 メッセージの送信に失敗しました。後でまたお試しください。」と赤枠で表示されてしまう。 リキャプチャも使用していたため、 １．recapchaとcontactform7の相性問題をチェック（5.1もしくは4.7まで戻さないとv3のrecapchaをエラーとみなしてしまう） 　→だがこの場合は、「 メッセージの送信に失敗しました。後でまたお試しください。」がオレンジ枠で表示される。 ２．赤枠表示の場合はSMTP関連が怪しいのでメーラーを別途設定できるプラグインを入れることで解決することもあり ３．今回、レンタルしたエックスサーバーは実は試用期間中だった！ 　→試用期間中だとメール送信機能が使えないので実質エラーになっていた。 　→即契約完了して、再度メールフォームを送信したら問題なく送信された！

 クッキーの使用云々でGDPRを云々やることになったので、ワードプレスのサイトなのもありせっかくなのでプラグインを漁ってみた。 「Cookie Notice for GDPR & CCPA」というプラグイン。 基本は日本語化されているし、微妙に残っている英語も翻訳すればわかる程度。 設定も簡単でポンポンと完了させたのだが、何故だか！表示が！されない！ そもそも「Local」というWordpressのテスト環境がアプリひとつで構築できるMac用のアプリを使っていたのだが ・ローカル環境だからだめなのか？ 　→そんなはずはない ・オンラインの別のテストサイトでプラグインを設定 　→表示された… そこで、開発者ツール（webインスペクタ）を表示し、キャッシュ許可に関するポップアップが表示されているエリアを検証。 「cookie-notice」というclassなどを多用していたので、表示されていない側のテスト環境のソースで「cookie-notice」を検索。 だが、スタイルシートの読み込みくらいしかヒットしない！ ということは、本来読み込まれるはずの「ヘッダー」or「フッター」の位置に、プラグインの読み込みがされていないということではないか、という所へ至る。 プラグインが読み込まれる位置は「フッター」であれば、＜/body＞のすぐ上だったので、WPのソースを見に行くことに。 wp-content/themes/テーマ名/footer.php そして、「表示されるサイトのfooter.php」「表示されないサイトのfooter.php」の、/bodyタグの上に何があるか……！ ＜？php wp_footer(); ＞ に行き着きました。 ヘッダーの場合はおそらく wp_header　の箇所なのだろう。 今回表示させたかったWPのサイトは、完全カスタマイズされたWPテーマだったため、この記述が必要無かったのかもしれない…。 案の定、footer.php　の/body　直上に　wp_footer　の記述を追加したら、キャッシュ許可のポップアップが表示されました！！ 今後の為にメモ。

「Advanced Custom Fields」プラグインを使って作成したカスタムフィールドのセレクトボックスで選択されている内容を取得します。 <?php 　$field = get_field_object('hp-prefecture'); 　$value = $field['value']; 　$label = $field['choices'][$value]; ?> 表示したい場所で <?php echo $label; ?>

wordpressを5.3.2にアップデートしたタイミングか、エディタプラグインをアップデートしたタイミングか、おそらく前者のタイミングでお問い合わせ画面で「送信」ボタンを押した後の入力必須チェック等が表示されず、ボタンの横に更新ぐるぐるアイコンが表示し続ける、というバグを発見。 使っているプラグインは「Contact Form 7」。 そして原因はそのショートコードを、「Classic Paragraph」として書いてしまっていたことでした。 何故か今まではそれでも問題なく動いていたのだが、本来の使い方通り「ショートコード」内に書かないと上手く動かなくなりました。 wordpressのお問い合わせが最近急に使えなくなったよ！というかた、固定ページを確認してみてください。

wordpressで作成されたサイトで、固定ページに情報が掲載されていて、ある日時以降にアクセスしたら、何秒かディレイを置いて別ページにリダイレクトしたい。という要望が出ました。 metaタグを指定するまでアクセス権がなく、FTP接続も難しい…という状況で、いいプラグインが無いか探しました。 有名なリダイレクトプラグインは「Redirection」ですが、これではページを表示しれからのディレイが付けられない。 次に見つけたのが、「Delay Redirect」。投稿や固定ページの下部に設定画面が表示され、以下の内容が設定できます。 「Delay (in Seconds)」＝「ディレイ（秒）」 「Destination Path URL」＝「リダイレクト先のURL」 ただ、これだと「○月○日の○時からリダイレクト開始」という処理ができない… そこで、この数ヶ月で培ったwordpressカスタマイズの能力を集結！！ このプラグインを元にして、日時指定が出来るようにカスタマイズすればいいのでは！？ と思いついたのです。 ※個人ベースでテストはしていますが、このカスタマイズ内容を真似してサイトが壊れたよ！という苦情は受け付けておりませんので自己責任でお願いします。 カスタマイズした箇所は以下になります。 ■delay-redirect.php [38行目]　画面に表示する項目「秒」と「URL」の枠を定義している所に、日時を入れる場所を作ります。 //日時枠の追加 array( 'id' => 'delay-in-daytime', 'label' => 'リダイレクトを開始する日時 例）2020-01-17 17:15　※必ずこの形式で入力してください', 'type' => 'text', ), [145行目あたり]　設定された内容にしたがってリダイレクトメタを表示している場所をいじります。 //指定日時を過ぎているかチェック date_default_timezone_set('Asia/Tokyo'); $daytime = get_post_meta(...

①カスタムフィールドの中身を独自データベースへ登録する ②カスタムフィールド内で画像を登録する際にメディアアップローダーを使用する ・メディアアップローダーを使用して画像のURLを独自DBに登録する ・画像登録は2箇所作りたい ③独自データベースは2個作りたい ④登録したカスタムフィールドの中身を取得してコンテンツ内に表示する ①はこちらの記事で取り上げた中身になります。 ②カスタムフィールド内で画像を登録する際にメディアアップローダーを使用する https://gist.github.com/sushat4692/33df8a65474798fca0c6 こちらの記事の方法を参考に、①の際に作ったカスタムフィールド＆新規DBのソースと混ぜ合わせる必要があります。 「admin-media.js」がメディアアップローダーを使用してくれる動きをしてくれる。 「admin.css」これは今回使いません 「function.php」この中でカスタムフィールドを作成している部分があるが、カスタムフィールドを作成するところは①のプラグインとして作成してしまっているので、ソースの一部を参考する形になります。 １．「function.php」で画像の登録・表示処理をしている部分を、①のプラグイン「custom-meta-field1.php」に追記します。 function.phpにある[36行目]〜[50行目]を、プラグイン側の画像登録を表示したい箇所にコピペします。 プラグイン側のtableのtd内にコピペです。 <td> <div class="custom-media" data-type="image" data-title="画像" data-target="#field-image"> <input type="text" id="field-image" class="my-uploader__url widefat" name="street_img" value="<?php echo $str...

カスタムフィールドを作成して、その中身をDBに登録→取得して画面に表示するだけなら「Advanced Custom Fields」のプラグインだけで可能。 ■Advanced Custom Fieldsのプラグインで中身を取得・表示 １．プラグインをインストール ２．メニューの「カスタムフィールド」から新規追加 ３．投稿画面に表示するための「ラベル」とそれを格納・取得するための「名前」等を決める ４．画面に表示する際には「content.php」等、表示した場所で $shop_name = get_field('shop_name',$post_id); get_field(名前,ページID)として取得可能。 自分の場合は上記のように一度関数に代入してから、表示した場所で <?php echo $shop_name; ?> としている。 ★今回、管理画面上の投稿でカスタムフィールドにて登録した内容をあとからCSV一括登録・変更などでいじりたい、というのがあったが、このプラグインを追加って登録した内容は、DBのpostの中に１つのカスタムフィールド項目に対して必ず２つの内容が登録されることが発覚。 【DB内】wp_postmeta meta_id post_id meta_key meta_value 1 1 shop_name ○○商店 2 1 _shop_name field_****←英数字の羅列 この２行が無いと中身を取得出来ないようで、特に２行目の内容を持って別のカテゴリーやタグ、post_idと紐付けを行っているようだったので CSVからの登録プログラムを作成することがかなり困難に。 そこで、カスタムフィールドを自作し、かつDBも自作し、そこへ内容を登録する方法へ変更。 ■自作のDBを作成し、カスタムフィールドから登録するプラグイン ・wordpressに自作DBを追加する方法は以下サイトを参考に https://www.webopixel.net/wordpress/637.html １．Gistにアップされていたソースを丸々コピーして、「custom-meta-table.php」の名前で保存 ２．自分環境に合わせてカスタムフィールドを作成（html手作業） ...

１．プラグインをインストール ①SiteGuard WP Plugin ・大体のセキュリティ設定をやってくれる 【設定内容】 インストール・有効化すると、まずはログインURLが変更されます。 プラグイン画面の上部「ログインURLを変更」をクリックし、任意のURLを指定。 管理画面へのアクセス制限を「ON」 画像認証「ON」 「XMLRPC防御」で「XMLRPC無効化」を選択して「ON」 ②Edit Author Slug ・ユーザーIDを偽装させてログインIDを分かりにくくする 【設定内容】 インストール・有効化します。（個別設定メニューは表示されません） 「ユーザー」から各ユーザー編集画面に入ると、最下部に入力画面が表示されます。 「投稿者スラッグ」の所で、ユーザー名でもパスワードでも無い名前をつけます。 念の為、『ニックネーム（必須）」の所に、任意の名前を入力します（管理者 など） 「ブログ上の表示名」のプルダウンを選択すると、４で設定した名前が選択できます。 これは、投稿ページに表示される名前を変更する方法でもありますが、ここを変更しないとそもそも投稿ページにユーザー名、つまりログインIDがそのまま表示されてしまうことになるので、変更は必須です。 また、何故ユーザーIDを変更するのかというと、 「http://＊＊＊.com/ ?author=1」というようにURLを入力すると、ユーザー番号１番の人のユーザーIDが丸見えになってしまうのです。 元々は、「ユーザー１番の人の投稿まとめページ」としても意味合いなのですが、ここでユーザーID、つまりログインIDが知れてしまったらあとはパスワードを総当りされてしまうということ。 そこで、今回のプラグインを追加することにより、もしユーザーIDが見られてしまったとしても、それは３で設定したログインIDとは全く別のものが表示される、という仕組みです。 ③function.phpに追記 ・ユーザーIDの表示を試みようとするアクセスURLを404ページエラーにする 【function.php】 //ユーザーIDの表示ページを404エラーにする add_filter( 'author_rewrite_rules', ...