ページが見つかりませんでした – WordPressを中心にITネタを画像付きでわかりやすく丁寧に解説(旧:ゆうそうとITブログ) https://usortblog.com WordPressを中心にITネタを画像付きでわかりやすく丁寧に解説(旧:ゆうそうとITブログ) Wed, 13 Sep 2023 03:22:14 +0000 ja hourly 1 https://wordpress.org/?v=6.4.3 https://i0.wp.com/usortblog.com/wp-content/uploads/2017/05/cropped-usortblog_favicon-1.png?fit=32%2C32&ssl=1 ページが見つかりませんでした – WordPressを中心にITネタを画像付きでわかりやすく丁寧に解説(旧:ゆうそうとITブログ) https://usortblog.com 32 32 65101978 WordPressの埋め込みブロックで外部リンクは別タブ、内部リンクは同じタブで開くカスタマイズ https://usortblog.com/wp-embed-block-links/ https://usortblog.com/wp-embed-block-links/#respond Tue, 12 Sep 2023 23:04:00 +0000 https://usortblog.com/?p=37275

WordPressを使っていると、埋め込みブロックにリンクを挿入することがよくありますよね。しかし、外部リンクと内部リンクで開くタブを分けたいと思ったことはありませんか?この記事では、その方法を簡単に解説します。 事前準 […]]]>

WordPressを使っていると、埋め込みブロックにリンクを挿入することがよくありますよね。
しかし、外部リンクと内部リンクで開くタブを分けたいと思ったことはありませんか?この記事では、その方法を簡単に解説します。

事前準備: 子テーマ or プラグインの準備

この方法ではfunctions.phpにコードを記述する必要があります。そのため、以下のいずれかの準備が必要です。

  1. 子テーマを用意する: 既存のテーマに手を加えずに、新しい機能を追加するために子テーマを用意します。
  2. プラグインを使用する: WP CodeCode Snippetなどのプラグインをインストールして有効化します。

関連記事

functions.phpにコードを追加

事前準備が完了したら、テーマのfunctions.phpファイルに以下のコードを追加します。

function add_embed_target_blank_script() {
    ?>
    <script type="text/javascript">
        document.addEventListener('DOMContentLoaded', function() {
            var embedLinks = document.querySelectorAll('.wp-block-embed a');
            var siteUrl = '<?php echo site_url(); ?>'; // WordPressのサイトURLを取得

            embedLinks.forEach(function(link) {
                var linkHref = link.getAttribute('href');

                // リンクが内部リンクでない場合のみ、新しいタブで開くように設定
                if (linkHref.indexOf(siteUrl) === -1) {
                    link.setAttribute('target', '_blank');
                    link.setAttribute('rel', 'noopener noreferrer');
                }
            });
        });
    </script>
    <?php
}
add_action('wp_footer', 'add_embed_target_blank_script');

コードを追加または変更する際は、何か問題が発生した場合も自己責任であることを理解してください。

コードの解説

  • 5行目document.querySelectorAll('.wp-block-embed a'):埋め込みブロック内のすべてのリンクを取得します。
  • 6行目site_url(): WordPressのサイトURLを取得します。
  • 13行目link.setAttribute('target', '_blank'): 新しいタブでリンクを開くように設定します。
  • 14行目link.setAttribute('rel', 'noopener noreferrer'): セキュリティ対策として、rel属性にnoopener noreferrerを設定します。

まとめ

この記事では、WordPressの埋め込みブロックで外部リンクを別タブで開き、内部リンクを同じタブで開く方法を解説しました!
特に難しいことはなく、簡単なコードを追加するだけで実現できます。この手法を実践することで、ユーザーの利便性が向上しますよ☺

]]>
https://usortblog.com/wp-embed-block-links/feed/ 0 37275
WP Multibyte Patchの必要性!日本語でWordPressを使うならメリットばかり https://usortblog.com/wp-multibyte-patch-jp/ https://usortblog.com/wp-multibyte-patch-jp/#respond Thu, 24 Aug 2023 22:56:00 +0000 https://usortblog.com/?p=37254

WordPressで日本語を使うと、知らず知らずのうちに様々な問題が発生することがあります。 例えば、メールフォームからのメール送信時の文字化けや、全角スペースで検索欄が機能しない、日本語名のファイルに不具合が起こる、文 […]]]>

WordPressで日本語を使うと、知らず知らずのうちに様々な問題が発生することがあります。

例えば、メールフォームからのメール送信時の文字化けや、全角スペースで検索欄が機能しない、日本語名のファイルに不具合が起こる、文字数のカウントが不正確、ピンバックにバグがあるなど様々…。

そんな悩みを一気に解決してくれるのが、『WP Multibyte Patch』です!

この記事では、

  • WP Multibyte Patchについて
  • WP Multibyte Patchの必要性とメリット
  • WP Multibyte Patchの導入方法

について書いていきます!WP Multibyte Patchってよく聞くけどなんなんだろうと思っている方は是非記事をみてみてくださいね。

WP Multibyte Patchについて

WP Multibyte Patchは、日本語を含むマルチバイト文字に特化したプラグインです。
WP Multibyte Patchを導入すると、日本語や他の多バイト文字を正しく表示することができるようになります。文字が乱れる心配をすることなく、コンテンツをきちんと伝えることができます。シングルバイト文字もマルチバイト文字も、どちらもしっかりとサポートしてくれます。

シングルバイトとマルチバイトって?

シングルバイトは、ひとつの文字を1つの単位で扱う方法です。英語などのアルファベットはシングルバイト文字です。
一方、日本語や他の多くの言語は、1つの文字が複数の単位で構成されることがあり、これをマルチバイト文字といいます。マルチバイト文字は、通常の文字よりも複雑で、扱いが少し難しいことがあります。

WP Multibyte Patchの必要性とメリット

プラグイン「WP Multibyte Patc」を導入することで、以下のメリットが得られます。

WordPress内の検索欄での不具合を修正

日本語の文章では、全角スペースがよく使われますが、これが検索の際に問題を引き起こすことがあります。
WP Multibyte Patchがない場合、ユーザーが全角スペースで検索しても、半角スペースとして認識されず、意図した検索結果が表示されないことがあります。

しかし、WP Multibyte Patchを導入することで、全角スペースを半角に変換して検索できるようになり、日本語での検索がスムーズになります!

日本語を含むURLやファイル名を問題なく処理

WordPressサイトを移転したり、新しいサーバーに移ったりする際、日本語のファイル名が含まれた画像やファイルがうまく表示されないことがあります。
これは、日本語の文字は他の言語と異なる特殊なコードで表されているため、別の環境では正しく認識されないことがあるのです。

WP Multibyte Patchを導入することで、これらの問題を回避できます。日本語のファイル名もスムーズに処理され、サイト移行がより簡単になります。

メール送信時の文字化け問題を解決

WordPressのメールフォームを使って、メールを送信した際に文字化けが発生してしまうことがあります。WordPressは、文字のエンコードを正しく処理しないことがあり、日本語が意図せず文字化けしてしまうことがあります。

WP Multibyte Patchを導入することで、WordPress内でメールフォームから送信される日本語メッセージも文字化けすることなく、正しく相手に届けることができるようになります。

文字数カウントの正確化

記事やページを執筆する際には、日本語特有の文字によって文字数が正しくカウントされない問題が起こります。これにより、文字数制限を超えてしまったり、逆に不足してしまったりすることがあります。

しかし、WP Multibyte Patchを導入すれば、日本語の特殊な文字も正しくカウントされるようになります。これにより、記事やページを書く際、文字数が正確に表示されるので、文字数制限内にコンテンツを収めることができるようになります。

ピンバックのバグ修正

他のブログから自分の記事にリンクが貼られた際、その情報を表示する仕組みがピンバックです。
そんなピンバックですが、例えば、ピンバックのURLが日本語の場合に文字化けしたり、意図しない文字列に変換されたりすることがあります。これは、URLエンコードが異なるため、情報が正しく受け渡しされないことが原因です。

しかし、WP Multibyte Patchを導入することで、日本語を含むURLやタイトルを正しく処理し、ピンバックの表示が文字化けしたり乱れたりすることなく、スムーズに受け取ることができるようになります。

WP Multibyte Patchの導入方法

STEP
プラグイン > 新規追加をクリック

WordPressにログインし、「プラグイン」にオンマウスし、「新規追加」をクリックします。

STEP
「WP Multibyte Patch」を検索

検索欄で「WP Multibyte Patch」を検索します。

STEP
インストール&有効化

プラグインを見つけたら、「インストール」ボタンをクリックしてしばらく待ったら「有効化」ボタンをクリックします。

特別な設定は不要です。導入が完了しました!

まとめ

WP Multibyte Patchは、日本語WordPressサイトを最適化するために必要なプラグインです。
日本語の特性を理解し、正しく表示するための機能が豊富に詰まっています。検索の利便性向上URL・ファイル名のトラブル回避文字化け防止SEOへの影響向上など、さまざまな面でサイト運営をサポートします。

ぜひWP Multibyte Patchを導入してみてください。記事がお役に立てれば嬉しいです!

]]>
https://usortblog.com/wp-multibyte-patch-jp/feed/ 0 37254
WordPress初期設定ガイド【その3】:アイキャッチ、カテゴリー管理、URL設定の具体的な設定手順 https://usortblog.com/wordpress-initial-guide-3/ https://usortblog.com/wordpress-initial-guide-3/#respond Tue, 01 Aug 2023 06:59:01 +0000 https://usortblog.com/?p=33181

前回の記事 WordPress初期設定ガイド【その2】:セキュリティ&サイト性能アップのためのプラグイン4選 に続き、今回は アイキャッチ、カテゴリー管理、URL設定の具体的な設定手順 をご紹介します。 今回はエックスサ […]]]>

前回の記事 WordPress初期設定ガイド【その2】:セキュリティ&サイト性能アップのためのプラグイン4選 に続き、今回は アイキャッチ、カテゴリー管理、URL設定の具体的な設定手順 をご紹介します。

今回はエックスサーバーにテーマはCocoonを選びWordPressをインストールしたものに初期設定をしながら書いています。エックスサーバーやテーマがCocoonでない場合でも共通の設定がありますので、そうでない場合も是非ご覧下さい。

サイトアイコン(ファビコン)を設定しよう

サイトアイコン(ファビコン)は、ブラウザのタブやブックマークリストに表示される小さな画像で、あなたのホームページを一目で識別できるようにするためのものです。

通常、インストールした後のサイトアイコンは、テーマがCocoonだった場合は

このように Cocoon(繭) の形の画像になっています。多くの場合は

このような、WordPressのロゴマークになっています。

この サイトアイコン(ファビコン) をオリジナルの画像にして、あなたのホームページだとうことをわかりやすくしましょう。

サイトアイコン(ファビコン)用の画像が無料で作れるサービスで画像を作成する

サイトアイコンは 512×512ピクセル以上 のものを使うことを推奨されています。この画像を簡単に無料で作れるサービスがこのブログで提供している ロゴ・アイコン画像作成メーカー を使って作成してみます。

テキスト設定、画像設定 で上記のように設定してみました。作成は何度でもできますのでまずは適当に設定して [作成する] で作ってみて、値を増減したりして調整してみて下さい。

上記で [作成する] をクリックすると

このように画像が表示されるので、 ダウンロード をクリックしてPCに画像を保存します。画像名は重複を防ぐためにとても長いものになっていますのでPC上でもっと短い名前に変更しておいて下さい(変更しなくても問題は無いのですが💦)。

サイトアイコン(ファビコン)をアップロードする

この画像をアップします。

ダッシュボード 外観>カスタマイズ をクリック

サイト基本情報 をクリック

サイトアイコン の サイトアイコンを選択 をクリックします。

先ほど作った画像をアップロードして、 [選択] をクリック

サイトアイコン が指定されました。 [公開] をクリックして更新を確定します。

スマートフォンでホーム画面に追加したときの画像も更新される

ブラウザのタブに表示される画像だけでなく、スマートフォンでサイトをホーム画面に追加したときの画像も

このようにサイトアイコンに変わりました。これであなたのホームページがよりわかりやすくなります。

カテゴリーを最初に更新して「未分類」をなくそう

投稿は1つ以上の「カテゴリー」を選択することになっています。インストールしただけの状態だとカテゴリーは「未分類」というカテゴリーが一つだけあります。この「未分類」は、自分でカテゴリーを追加したあとでも投稿時にうっかりカテゴリーを選び忘れたとき自動的に選択されます。

そのため、「未分類」カテゴリーの記事がいくつかあるWordPressサイトを見ることが多くなります。せっかく書いた投稿が「未分類」というなんだかわからない状態にならないように最初に設定しておきたいと思います。

一番いいのは、一番自分が投稿しそうなカテゴリー名 に変えておくことです。

・ニュース or お知らせ
・ツール情報
・雑談

など、何でも良いのですが変えてくことをお勧めします。私の場合は作ったツールを紹介することが主だと思うので ツール情報 に変更しようと思います。

ダッシュボード 投稿>カテゴリー をクリック。

未分類 の下の 編集 をクリック

このような編集画面が表示されますので、

名前:ツール情報 スラッグ:tool_information に変更して、

画面左下の [更新] をクリック、これで変更が完了です。

更新前はこのように 未分類 というカテゴリーだったものも、

更新後はこのように ツール情報 というカテゴリーに変わりました。

アイキャッチについての設定

投稿などで表示されるアイキャッチですが、指定し忘れるとCocoonの場合は

このように NO IMAGE という特に意味の無い画像が表示されます。他のテーマでもこのように表示される場合やあるいは何も表示されなかったりします。

アイキャッチ画像はないよりあった方が記事を読んでもらえる確率が高まるかと思いますのでこれについて対応したいと思います。

アイキャッチを自動で表示するように設定する

Cocoonの場合

Cocoonの場合はアイキャッチが指定されていない場合、記事中の最初の画像をアイキャッチとして指定するというオプションがあります。

ダッシュボード Cocoon設定 をクリックして、画像 タブをクリックします。

アイキャッチの自動設定 という項目の アイキャッチ自動設定を有効にする

 にチェックを入れて

ページ左下にある [変更をまとめて保存] をクリックして保存します。これで

このようにアイキャッチ画像を指定し忘れた場合でも、

このように自動的に一つめの画像がアイキャッチとして保存されるようになります。

テーマCocoon以外の場合、Auto Featured Image プラグインを入れる

テーマがCocoonでない場合でも Auto Featured Image (Auto Post Thumbnail) というプラグインを入れることで同じことが実現できます。インストール後、有効化するだけで上記と同様の結果になります。

NO IMAGE画像を独自のものにする

コンテンツに画像が使われていない場合、テーマによっては「NO IMAGE」画像を表示することになります。コンテンツに画像を使わなくても自分のWEBサイトらしい画像を表示したい、という場合は「NO IMAGE」画像を指定しておくことができます。

Cocoonで「NO IMAGE」を指定する方法

Cocoonで「NO IMAGE」を指定する方法は以下の通りです。※ NO IMAGE用画像は アイキャッチ画像作成メーカー で作りました。ご利用下さい!

ダッシュボード Cocoon設定 をクリックして、画像 タブをクリックします。

NO IMAGE設定 NO IMAGE画像 という項目がるので、作成した画像を [選択] からアップロードします。

[変更をまとめて保存] をクリックします。これでアイキャッチの指定をせず、コンテンツに画像がない場合でも

このように指定した画像が表示されるようになります。

Lightning、SWELL の場合のNO IMAGE画像の指定方法

Lightning、SWELL の場合でも同じように NO IMAGE画像が指定できるようです。詳しくは以下のリンクページを御覧下さい。

Lightningの場合

https://ex-unit.nagoya/ja/about/default-thumbnail

SWELLの場合

https://swell-theme.com/basic-setting/2237/

slugが指定されなかったとき、日本語のタイトルをslugにしないようにする

まず、slug(スラッグ)とは何かというと、URLに表示される

 http(s)://あなたのドメイン/something-for-title

の something-for-title の部分のことを言います。これは編集画面の

この URL という部分に表示されています。このままだとslugが日本語になってしまいます。URLが日本語になると、一見「わかりやすい」と思われるかもしれません。表示するときも、

このように表示されます。しかし、このURLを人に知らせようとしてコピーしてペーストすると、

http://example.com/%e4%bc%9a%e7%a4%be%e6%a6%82%e8%a6%81/

このように日本語がエンコードされた形になってしまいます。ちょっと戸惑ってしまいますね。エンコードされた部分を消して「会社概要」と書き換えて送ればその形でもホームページを表示させることはできますが煩雑なことになってしまいます。

その理由やその他の理由もあり、slug(スラッグ)は英数字であることが望ましいということになります。

しかし、slugの指定は得てして忘れがちなのでslugを指定し忘れたときに自動的に英数字にしてくれるように設定しておくことができます。

Cocoonで日本語タイトルのスラッグを自動的に英数字にする方法

Cocoonで日本語タイトルのスラッグを自動的に英数字にする方法は、

ダッシュボード Cocoon設定 をクリックして、その他 タブをクリックします。

日本語スラッグ という項目の 日本語スラッグを半角英数字にする

にチェックを入れて、[変更をまとめて保存] をクリックして保存します。これで日本語タイトルのスラッグを指定しなかったときに post-xxxx の形の英数字に自動的に書き換えてくれるようになります。

Cocoon以外の時のURLを英数字にする方法:プラグイン編

Cocoon以外の時にURLを自動的に英数字にする方法はまずプラグインを使う方法があります。

Simple Slug Translate と SLUG TRANSLATER を使うと日本語のタイトルを翻訳してスラッグにしてくれる、と思われます。試してみてはいないのではっきりとしてことが言えず申し訳ありません。

これらのプラグインを利用するにはAPIが使われているのでそれぞれAPIの登録をしてからの利用となるようです。

Cocoon以外の時のURLを英数字にする方法:funcions.php編

子テーマを使われている場合はfunctions.phpに記述することで日本語スラッグの場合に自動的に英数字に置き換えることができます。

function auto_post_slug( $slug, $post_ID, $post_status, $post_type ) {
    if ( preg_match( '/(%[0-9a-f]{2})+/', $slug ) ) {
        $slug = utf8_uri_encode( $post_type ) . '-' . $post_ID;
    }
    return $slug;
}
add_filter( 'wp_unique_post_slug', 'auto_post_slug', 10, 4 );

このコードを functions.php に貼り付けると自動的に英数字のslug(スラッグ)に書き換わるようになります。

ドメインだけで呼び出したときにhttps://にならない問題の解決

SSLに関しては既に サーバーパネルでSSLの設定をする で設定済みです。しかしそれでもまだブラウザのURL欄にドメイン(例:example.com)だけを入力してWEBサイトを表示したときに http://example.com になってしまいます。この問題について解決しておきたいと思います。

プラグインを使って強制的に https:// にリダイレクトする

プラグイン Easy HTTPS Redirection を使ってドメインだけが入力されたときに強制的にhttps://にリダイレクトすることができます。

このプラグインをインストール&有効化します。

ダッシュボード 設定>HTTPS Redirection をクリック

このような画面になります。黄色枠では注意事項が書かれていて、

このプラグインの機能を有効にする前に、サイトの HTTPS URL https://ドメイン名にアクセスして、ページが正しく読み込まれることを確認してください。

ということですので、必ず https://ドメイン名 でページが読み込めることを確認します。よろしければ

Enable automatic redirection to the “HTTPS” にチェックを入れて、

[変更を保存] をクリックします。これで設定が完了し、常にhttps://でWEBサイトが表示されるようになります。

.htaccessを修正して強制的に https:// にリダイレクトする

FTPなどを使って .htaccess を修正してアップロードできるような場合はこちらの方法でもリダイレクトをすることが可能です。ただし、.htaccess の編集を誤るとWEBが表示されないなどの問題になることもありますので自己責任にてお願いします。

元のファイルはコピーして保存しておき、問題があったときに元に戻せるようにしておくことをお勧めします。

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
</IfModule>

このコードを.htaccess の頭に挿入して、保存して置き換えます。これで設定が完了し、常にhttps://でWEBサイトが表示されるようになります。

WordPress初期設定ガイド:全記事一覧

このガイドでは、WordPressの初期設定からサイトの最適化まで、ステップバイステップで説明しています。以下のリストから、特定の記事を読むこともできます。

]]>
https://usortblog.com/wordpress-initial-guide-3/feed/ 0 33181
WordPress初期設定ガイド【その2】:セキュリティ&サイト性能アップのためのプラグイン4選 https://usortblog.com/wordpress-initial-guide-2/ https://usortblog.com/wordpress-initial-guide-2/#respond Fri, 14 Jul 2023 00:40:00 +0000 https://usortblog.com/?p=33106

前回の記事 WordPress初期設定ガイド【その1】最初に行う SSL、パーマリンク、ニックネーム、ファビコンの設定 に続き、今回はセキュリティとサイト性能のためのプラグイン4選の設定方法と効果をご紹介します。 今回は […]]]>

前回の記事 WordPress初期設定ガイド【その1】最初に行う SSL、パーマリンク、ニックネーム、ファビコンの設定 に続き、今回はセキュリティとサイト性能のためのプラグイン4選の設定方法と効果をご紹介します。

今回はエックスサーバーにテーマはCocoonを選びWordPressをインストールしたものに初期設定をしながら書いています。エックスサーバーやテーマがCocoonでない場合でも今回はすべて共通の設定となりますので、そうでない場合も是非ご覧下さい。安全性と性能向上のためにこれらのプラグインを設定しましょう。

Wp Multibyte Patchは日本語WordPressサイトを強化するための必須プラグイン

WordPressはインストールしたままでは日本語環境での運用に一部問題があります。その問題を解決するために、Wp Multibyte Patchというプラグインを導入しましょう。

Wp Multibyte Patchは、WordPressの多言語対応を強化するプラグインです。特に日本語環境での文字数カウント文字列の切り詰め検索の精度向上などに効果を発揮します。

Wp Multibyte Patch をインストールする

ダッシュボード プラグイン>新規追加 をクリック

キーワードに wp multibyte patch と入力すると、

このプラグインが見つかります。[今すぐインストール] をクリックしたあと、同じところに表示される[有効化]をクリックします。これでプラグインのインストールは終了です。

Wp Multibyte Patch の効果、検索時に全角スペースでもOKになる

Wp Multibyte Patch の効果で一番わかりやすいのは、「検索時に全角スペースでもOKになる」ということです。検索時に複数のキーワードを入れるときに、日本語で入力していれば

上記の様に コンテンツ (全角スペース) 始めて のようになると思います。プラグインを入れる前はこのキーワードでは投稿が見つかりませんでした。

Wp Multibyte Patch をインストールして有効化した後は、

このように、投稿が見つかりました。よく見ると全角スペースが半角スペースに置き換わった状態で検索されています。

「自分のホームページでは検索は使わないから…」と思われる方もいるかもしれませんが、Wp Multibyte Patch の効果はこれだけでなく日本語でコンテンツを入力されている方なら是非インストールすることをお勧めします。

Edit Author Slug の導入でプラグインログインに使うユーザー名を守る

WordPressでは、初期状態でユーザーのURL(スラッグ)が「yourwebsite.com/author/ユーザー名」の形式で設定されています。この機能は「投稿者が書いた記事の一覧を表示する」ものです。複数の投稿者がある場合はある投稿者の記事をたくさん読みたいような場合に便利な機能です。

しかし、このままだとログインで使うユーザー名がそのまま公開されてしまうため、セキュリティ上のリスクがあります。具体的にはCocoonの場合は投稿の

✎マークの右の umotomika をクリックすると、

表示されてしまいます。他にもこのURLを表示する方法があります。セキュリティのためこのURLの表示を変更したいです。
※ この umotomika 部分も、ブログで表示される名前を変える で変更していなければログイン名が表示されます。

Edit Author Slugを使うとこのURLの author/ユーザー名 部分を変更できるようになります。

Edit Author Slug をインストールする

インストールの手順は 上記の方法 と同じになります。違うところは、入力するキーワードが edit author slug となることと、見つかるプラグインは以下のものになるところのみです。

Edit Author Slug の設定をする

インストールが終わったら Edit Author Slug の設定をします。

ダッシュボード 設定>投稿者スラッグ編集 をクリック

Edit Author Slug の設定画面が表示されます。

投稿者ベースに author とあります。これは初期設定なのでスパムなどが狙えるURLとなりますので変更します。

なんでもいいのですが今回は chosha と変更してみました。

画面左下にある [変更を保存] をクリックします。この時点で「yourwebsite.com/author/ユーザー名」 の author の部分が指定した chosha に変わりました。さらにもう少しセキュリティを高めてみます。

ユーザー>プロフィール をクリック

プラグインを入れたことでプロフィールに

投稿者スラッグ編集 という項目が増えています。初期状態では ユーザー名 が選択されているので、これを変更します。

なんでもいいのですが今回は author-is-umoto-mika と変更してみました。

画面左下にある [プロフィールを更新] をクリック。これで、「yourwebsite.com/author/ユーザー名」というURLが

このように、yourwebsite.com/chosha/author-is-umoto-mikaというURLになりました。

EWWW Image Optimizer で画像最適化とプライバシー保護を実現

ホームページで画像を使用すると、その画像のサイズが大きいとページの読み込み速度が遅くなり、ユーザー体験やSEOに悪影響を及ぼす可能性があります。「EWWW Image Optimizer」は、画像のサイズを自動的に最適化し、ページの読み込み速度を向上させるプラグインです。

さらに、「EWWW Image Optimizer」には、画像からEXIFデータ(撮影場所の情報を含む)を自動的に削除する機能もあります。これにより、写真を撮影した場所を特定できることがなくなり、プライバシーを保護することができます。

EWWW Image Optimizerをインストールする

インストールの手順は 上記の方法 と同じになります。違うところは、入力するキーワードが ewww image optimizer となることと、見つかるプラグインは以下のものになるところのみです。

プラグインの有効化 までが終わったら、設定を行います。

設定>EWWW Image Optimizer をクリック

このような画面になるので、

サイトを高速化、保存スペースを節約、今は無料モードのままにする にチェックを入れて [次] をクリック

この画面が表示されます。特に変更しなくても良いかと思いますので[設定を保存] をクリックします。

この画面が表示されるので [完了] をクリック。

EWWW Image Optimizer の通常の設定画面に切り替わりました。下の方を見ると、

このように 撮影場所の情報を含むEXIFが削除され、画像も自動的に上限の範囲内にリサイズされるようになっていることがわかります。

EWWW Image Optimizer を使わない場合とのEXIF情報の違いを確認

EWWW Image Optimizer を使わない状態の時に画像をアップロードすると、

このような投稿の画像を右クリックして閲覧者のPCに保存した後に、画像の情報を見ると

このように 緯度、経度 の情報が入っています。これを元にGoogleMapで検索すればその写真がどこで撮られたのかという位置がわかるようになります。

これは相模湖に行ったときの写真です。観光地などでは良いと思いますが、自宅などで撮影した場合はこの情報が出るのは良くないと思います。先ほどのように EWWW Image Optimizer をインストールして設定後では、同じ写真をアップロードしたものをPCに保存して、情報を見てみると

このようにEXIFデータが削除されて、位置情報もなくなっていました。

現在(2023/08/22)原因は特定できませんがこの設定を正しく行っていても位置情報が削除されないというケースが一部のサイトで確認されています。 EWWW Image Optimizer をインストール後、位置情報が正しく削除されているかどうかをご自分で確認することをお勧めします。原因などが分かりましたらまた、こちらのブログを更新します。

EWWW Image Optimizer には他にも役立つ機能がありますので、慣れてきたら設定から機能を追加することも可能です。

SiteGuard WP Plugin でホームページのセキュリティを強化する

SiteGuard WP Pluginは、WordPressのセキュリティを強化するためのプラグインです。WordPressはとても便利なツールですが、その便利さゆえに、悪意のある人々から攻撃を受けやすいんです。そんな時に役立つのが、このSiteGuard WP Pluginなんです。

SiteGuard WP Pluginをインストールする

インストールの手順は 上記の方法 と同じになります。違うところは、入力するキーワードが siteguard wp plugin となることと、見つかるプラグインは以下のものになるところのみです。

ログインURLを自分だけのものにしよう

SiteGuard WP Pluginを有効化するとすぐに

このような表示が出て、ログインのためのURL(youtwebsite/wp-login.php)が変更されたことが分かります。新しいログインURL をクリックしてブックマークしておきましょう。

これにより、悪意のあるログイン試行を防ぐことができます。初期設定では login_<5桁のランダムな数字> となっていますが、お好みの名前に変更することも可能です。

日本語キャプチャで安全性アップ

またログイン時にひらがなのキャプチャ(画像認証)の文字が追加されます。

インストール前は

このようなログイン画面だったものが、インストール後は

このように ひらがな4文字の画像認証 が自動的に追加されます。

これにより、不正なログインや不正なコメントを防ぐことができます。ひらがななのでスパムに多い非日本語圏からの攻撃からより守られるようになります。

他にも便利な機能がいっぱい

他にも、ログインに失敗したときにアカウントを一時的にロックする機能や、不正ログインをメールで知らせてくれる機能など、たくさんの便利な機能があります。

次回は WordPress初期設定ガイド【その3】:アイキャッチ、URL設定、カテゴリー管理の実践的な設定手順 について記事を書く予定です。お楽しみに!

WordPress初期設定ガイド:全記事一覧

このガイドでは、WordPressの初期設定からサイトの最適化まで、ステップバイステップで説明しています。以下のリストから、特定の記事を読むこともできます。

]]>
https://usortblog.com/wordpress-initial-guide-2/feed/ 0 33106
WordPress初期設定ガイド【その1】最初に行う SSL、パーマリンク、ニックネーム、ファビコンの設定 https://usortblog.com/wordpress-initial-guide-1/ https://usortblog.com/wordpress-initial-guide-1/#respond Wed, 05 Jul 2023 04:30:00 +0000 https://usortblog.com/?p=33001

レンタルサーバーにWordPressをインストールした後に行う 初期設定 はいくつか決まってしておいた方がいいものがあります。一つ一つは簡単な設定ではあるのですが、設定する数が多いため設定に慣れた人でも何かを抜かしてしま […]]]>

レンタルサーバーにWordPressをインストールした後に行う 初期設定 はいくつか決まってしておいた方がいいものがあります。一つ一つは簡単な設定ではあるのですが、設定する数が多いため設定に慣れた人でも何かを抜かしてしまいがちなので、順を追って記事にしておきたいと思います。

今回はエックスサーバーにテーマはCocoonを選びWordPressをインストールしたものに初期設定をしながら書いています。エックスサーバーやテーマがCocoonでない場合でもおおよその部分は共通の設定となりますので、そうでない場合も是非ご覧下さい。

WordPress初期設定ガイド【その1】: 最初に行う SSL、パーマリンク、ニックネーム、ファビコンの設定
WordPress初期設定ガイド【その2】:セキュリティ&サイト性能アップのためのプラグイン4選
WordPress初期設定ガイド【その3】:アイキャッチ、URL設定、カテゴリー管理の 実践的な設定手順

の3回でWordPress初期設定ガイド を完成させる予定です。今回は、WordPress初期設定ガイド【その1】インストール直後に行うべき基本設定を書きます。

サーバーパネルでSSLの設定をする

エックスサーバーなら無料でホームページにSSLを利用することができます。まずはこの設定をしておきましょう。待ち時間がありますのでまず最初にしておきたい設定です。(※ エックスサーバー以外でも多くのサーバーではSSLが無料で設定できます)

サーバーパネルにログインして、

xserver SSL設定

ドメイン>SSL設定 をクリック。

SSL設定 画面になるので、

インストールしたドメイン(仮にexample.comとします)の 選択する をクリック

このような表示になりますので [変更] ボタンをクリック

[ONにする] をクリック

この画面になれば設定は終了です。SSL設定一覧 というタブの文字をクリックすると

すぐには反映されないので、この画面の[反映待ち]が消えるまで待つことになります。このページで SSL設定一覧 をクリックして状態を確認するか、もしくはブラウザからURLを入力して確認しながら待ちます。

この状態でURLを見ると

このような表示や

このような表示になります。

時間が経てばWordPressの初期画面が表示されますが、今回はSSLが使えるようになるまで40分強かかりました。

SSLが通った直後にする設定

SSLが通ったら、 https://あなたのドメイン名/wp-login.php からログインします。そして、

設定 をクリック

WordPressアドレス(URL)サイトアドレス(URL)の2箇所の http://

https:// に書き換えます。

画面左下の [変更を保存] をクリックしたら設定は終了です。

パーマリンクの設定

この設定はあくまでも「こうしておいた方が良いと思われる」設定なのでこの方法が好きでない場合はスキップしていただいてかまいません。SEO的にも効果があるといわれていることもあり、自分は必ずこの設定にしています。

ダッシュボード>パーマリンク をクリックします

パーマリンクは初期状態だと、

日付と投稿名 が選択されています。この一覧にある

投稿名 のラジオボタンをチェックして、

変更を保存 をクリックして保存します。これでパーマリンクが投稿名で表示されるようになります。

セキュリティのため最初に管理者ユーザーの設定をする

WordPressをインストールしたときに作った管理者ユーザーのセキュリティを高めるための設定をします。

ログインアタックは自動的なプログラムで行われていることが多く、そのためにユーザー名を自動的に取得してそれを利用しているようです。ユーザー名の自動取得を防ぐための設定をします。

今回は umotomika というユーザー名だった場合の例でご説明します。

ブログ上で表示される名前を変える

WordPressの初期の状態では(テーマもよりますが)投稿の詳細画面には、

このように2箇所 umotomika というユーザー名が表示されてしまっています。この表示をユーザー名以外に変更します。

変更方法は、

WordPressダッシュボード>ユーザー>ユーザー一覧

ダッシュボード>ユーザー>ユーザー一覧 をクリック

WordPressダッシュボード>ユーザー>ユーザー一覧 編集

管理者の名前の下の 編集 をクリック

このように ユーザー名、ニックネーム、ブログ上の表示名 の3つがすべて同じ ユーザー名となっています。これを

まず、ニックネームを入力します。するとブログ上の表示名のリストの中に今入力したニックネームが表示されるのでそれを選択します。

画面左下にある プロフィールを更新 をクリックします。これでブログに表示される名前を変えることができました。

サイトアイコンの設定

忘れないうちにサイトアイコンの設定もしておきましょう。

サイトアイコンはあなたのウェブサイトを代表する小さなロゴや画像といったものです。サイトアイコンは、ブラウザのタブ、ブックマークバー、モバイルアプリのホーム画面などで表示されます。これは一般的に「ファビコン」とも呼ばれます。

インストール直後のサイトアイコンはテーマがCocoonの場合は、

このように 青い背景に繭(cocoon) のような画像になっています。テーマがCocoon以外の場合、多くは

このように WordPressのマーク になることが多いと思います。これを独自のものにすることで、自分のホームページが表示されたときの印象を変えることができます。

サイトアイコンをWEBサービス「テキストロゴ・アイコン作成メーカー」で作る

サイトアイコンの大きさは512×512以上の大きさにすることが推奨されています。サイトアイコンを作る場合はこのブログの テキストロゴ・アイコン作成メーカー を使うと簡単にできます。是非ご利用下さい😄

このように設定して [作成する] をクリックすると、

このようにアイコンが作成できましたので ダウンロード をクリックして画像を保存します。画像は一意にするために長い名前になっていますがお好きな名前に変更されるとわかりやすいかと思います。

サイトアイコンをアップロードする

サイトアイコンをアップロードします。

ダッシュボード 外観>カスタマイズ をクリック。

※ ここにカスタマイズがない場合は ブロックテーマ をお使いです。その場合はまた方法がことなりますが、今回は長くなるので説明は省略します ブロックテーマ サイトアイコン で検索するといくつか情報が出てくると思います。

サイト基本情報 をクリック

[サイトアイコンを選択] をクリック

先ほどダウンロードした画像をアップロードし、[選択]をクリック。

このように表示されますので [公開] をクリック。

公開済み と表示され、ブラウザのタブに表示されるマークも

このようになりました。iPhoneのSafariでホーム画面に追加 をしたときも

このようにサイトアイコンが表示されるようになりました!

次回は WordPress初期設定ガイド【その2】:セキュリティ&サイト性能アップのためのプラグイン4選です。是非ご覧下さい。

WordPress初期設定ガイド:全記事一覧

このガイドでは、WordPressの初期設定からサイトの最適化まで、ステップバイステップで説明しています。以下のリストから、特定の記事を読むこともできます。

]]>
https://usortblog.com/wordpress-initial-guide-1/feed/ 0 33001
アイキャッチ画像の重要性とデザインのポイント!アイキャッチ画像作成メーカーが解決する面倒な作業 https://usortblog.com/easy-eyecatch-design/ https://usortblog.com/easy-eyecatch-design/#respond Thu, 29 Jun 2023 22:08:00 +0000 https://usortblog.com/?p=32952

ウェブサイトやブログの記事には、目を引く効果的なアイキャッチ画像が欠かせません。しかし、画像編集ツールを使って都度作成するのは手間がかかりますよね。 そこで、ゆーそうとITブログのアイキャッチ画像作成メーカーがお役立てい […]]]>

ウェブサイトやブログの記事には、目を引く効果的なアイキャッチ画像が欠かせません。
しかし、画像編集ツールを使って都度作成するのは手間がかかりますよね。

そこで、ゆーそうとITブログのアイキャッチ画像作成メーカーがお役立ていただけると思います!

本記事では、アイキャッチ画像の重要性と効果的なデザインのポイントを紹介しながら、ゆーそうとITブログのアイキャッチ画像作成メーカーの活用方法をご紹介します。

ぜひ試してみてください!

アイキャッチ画像の重要性とは

アイキャッチ画像って、どれくらい重要なんですか?

実は、アイキャッチ画像はコンテンツの印象を左右する非常に重要な要素なんです。

ウェブコンテンツを効果的に伝えるためには、目を引くアイキャッチ画像が欠かせません。

アイキャッチ画像は、検索結果やSNSのタイムラインなどで目にしやすく、記事をクリックしようかの目安となります。魅力的で引きつけられるアイキャッチ画像を作成することで、読者の興味を引き、クリックシェア閲覧の増加につなげることができるのです。

アイキャッチ画像はコンテンツの一部として、記事のイメージや内容を視覚的に表現する役割も担っています。適切なデザインやイメージの選定をすることで、読者にコンテンツの魅力や付加価値を伝えることができます。

アイキャッチ画像作成の面倒な作業

このようにアイキャッチ画像はコンテンツ提供においてとても重要な要素です。
しかし、従来のアイキャッチ画像作成は手作業で行われることが多く、画像編集ツールの使用やデザインスキルが必要な場合が多くあります。

私自身、アイキャッチ画像を作成するたびに、画像編集ツールを起動し、サイズや形式の調整、テキストの追加、エフェクトの設定など、手間のかかる作業を行う必要がありました。

特にデザインに自信のない人にとっては、時間と労力を要する課題だと思われまます。

私もアイキャッチ画像を作成するのですが、毎回編集作業に時間を取られてしまいます。

それはよくある悩みですね。でも大丈夫です!アイキャッチ画像作成メーカーを使えば、手間をかけずに素早くアイキャッチ画像を作成できますよ。

アイキャッチ画像作成メーカー・ツールが解決するメリット

そこで、ゆーそうとITブログではアイキャッチ画像作成メーカー・ツールを作り、無料で公開させていただいています!

アイキャッチ画像作成メーカーは、フォント設定やデザイン設定など便利な機能を使えば誰でも簡単にプロレベルのアイキャッチ画像を作成できるようになります。

アイキャッチ画像作成メーカーの主なメリットは以下の通りです。

時間と手間の節約

アイキャッチ画像作成メーカーは、直感的な操作や事前設定されたテンプレートを活用することで、作成にかかる時間と手間を大幅に削減します。

煩雑な手順や編集作業が不要なため、誰でも迅速かつ効率的にアイキャッチ画像を作成することができます。

おしゃれなデザイン

アイキャッチ画像作成メーカーは、テキストや画像を設定するだけで、おしゃれなアイキャッチ画像の作成をサポートします。デザインに自信のない人でも、見栄えのするアイキャッチ画像を簡単に作成することができます。

ワンクリックで適切なサイズを設定

アイキャッチ画像作成メーカーは、WordPressやYoutubeのアイキャッチ画像はもちろん、SNSのヘッダー画像やカバー画像、また、Instagramの投稿画像に最適なサイズをワンクリックで再現します。

これにより、自分で画像サイズを調べなくてもアイキャッチ画像などを作ることができるのです。

テキストや画像を入力するだけでできるなんて、手間や時間を削減できて便利そうですね!

そうなんです。私自身これを作ったおかげでアイキャッチ画像にテキストを入れたりするようになりました(笑)

アイキャッチ画像作成のデザインのポイント

アイキャッチ画像を効果的に作成するためには、いくつかのデザインのポイントに注意する必要があります。以下に、重要なポイントをご紹介します。

視覚的な魅力を持つ色を使う

アイキャッチ画像では、鮮やかな色彩や色の対比などを活用することが重要です。色彩ごとにイメージが異なり、どのような情報が書かれているかやその時の感情の表現に大きな影響を与えるため、適切な色を選ぶことで、視覚的な魅力を高めることができます。

そういえば、赤は情熱で目を引く色で、青は冷静でクリーンなイメージがありますね。

そんな感じで色のイメージを使ってアイキャッチ画像を作るのもポイントの一つです。

引きつけるテキストの選択と配置

アイキャッチ画像では、テキストを効果的に活用することが重要です。読者の注意を引きつける魅力的なフォントやテキストスタイルを選び、適切な配置やサイズ調整を行うことで、メッセージの伝達力を高めることができます。

目的に合ったイメージの選定

アイキャッチ画像では、コンテンツのテーマや目的に合ったイメージを選ぶことが重要です。イメージは読者の関心を引く力があり、コンテンツの内容や雰囲気を表現する役割を果たします。目的に合ったイメージを選ぶことで、読者の興味を引きつけ、クリックやシェアの増加につなげることができます。

アイキャッチ画像作成メーカー・ツールの使い方

アイキャッチ画像作成メーカーを使うことで、誰でも簡単に魅力的なアイキャッチ画像を作成することができます。こちらの記事に一般的な使い方の手順が書かれていますのでご覧ください。

アイキャッチ画像作成メーカーはまだまだアップデートを続けていきます

アイキャッチ画像作成メーカーは、ユーザーからのフィードバックを重視し、改善と発展を続けています。

ユーザーの声やニーズを取り入れながら、より使いやすいインターフェースや新機能の開発が行われています。さらに、コンテンツ制作のトレンドや需要の変化に合わせて、新たな機能やアセットが追加されています。

ゆーそうとITブログのアイキャッチ画像作成メーカーを使って簡単にアイキャッチ画像を作ってみてください!

]]>
https://usortblog.com/easy-eyecatch-design/feed/ 0 32952
Xserverの独自ドメイン永久無料特典がさらに強化されました!最大2個のドメインを無料で利用しよう https://usortblog.com/xserver-free-domain2/ https://usortblog.com/xserver-free-domain2/#respond Thu, 29 Jun 2023 06:48:30 +0000 https://usortblog.com/?p=32955

WordPressでよく使われるサーバーのXserverですが、独自ドメイン永久無料特典がさらに強化されました!Xserverの独自ドメイン永久無料特典が1個→最大2個のドメインを無料で利用できるようになっています。 X […]]]>

WordPressでよく使われるサーバーのXserverですが、独自ドメイン永久無料特典がさらに強化されました!
Xserverの独自ドメイン永久無料特典が1個最大2個のドメインを無料で利用できるようになっています。

Xserverを検討している方にとっての後押しとなってくれるニュースですね。

本記事では、Xserverの魅力と無料ドメイン特典の詳細について紹介します!

Xserverの独自ドメイン永久無料特典がパワーアップ!

Xserverの独自ドメイン永久無料特典がさらに強化されました。
これまでは1つのドメインが無料で利用できましたが、今回の強化により最大2個のドメインが無料で利用できるようになりました。個人ブログやビジネスサイトを運営する方にとっては絶好の機会です。

独自ドメインを持つことのメリット

独自ドメインを持つことで、ウェブサイトやブログを本格的に運営している印象を与えることができます。
Xserverの独自ドメイン永久無料特典を活用することで、自分のウェブサイトに最大2つの独自ドメインを設定することができます。これにより、ブランドの強化やSEOの向上につなげることができます。

Xserverの独自ドメイン永久無料特典の詳細

独自ドメイン永久無料特典は、新規/既存に関わらず、Xserverを利用しているすべての方に適用されます。新規取得や移管を行うドメインに加え、既存の契約中のドメインにも適用可能です。

私のような現在サーバー契約中の人でも二つ目の独自ドメインを永久無料にできちゃいます!

対象サービス

対象となるサービスは以下のとおりです。

対象サービス名対象プラン
エックスサーバースタンダード
※「24ヶ月」以上のご契約で独自ドメインが2つ無料になります。
プレミアム
ビジネス
Xserverビジネススタンダード
プレミアム
エンタープライズ   
マネージド仮想専用エントリー
マネージド仮想専用ミドル
マネージド仮想専用ハイエンド
マネージド専用エントリー
マネージド専用ハイエンド
マネージド専用ハイエンド+

お好きなドメインを選択可能!

独自ドメイン永久無料特典は、対象プランやドメイン名によって取得できる数が異なります。
対象プランや取得できるドメイン数の一覧です。

対象プラン対象ドメイン
1つまで取得できるドメインスタンダード、プレミアム、ビジネス.com、.net、.org、.info、.biz 、.xyz、.link、.click
プレミアム、ビジネス.jp
ビジネス.co.jp、 .or.jp、 .ne.jp、 .gr.jp
※新規取得には取得条件があります。
2つまで取得できるドメインスタンダード、プレミアム、ビジネス.blog、 .site、 .online

まとめ

この記事のまとめです。

  • Xserverの独自ドメイン永久無料特典が最大2個のドメインに強化されました。
  • Xserverの永久無料ドメインの特典は既存のお客様と新規の方に適用されます。
  • 対象サービスやドメインの種類には条件があります。

Xserverは高速性と信頼性に優れており、運用サイト数が230万件以上ある初心者でも使いやすいサーバーです。今回のXserverの独自ドメイン永久無料特典を活用して、魅力的なブログを作ってみてください。

Xserverの公式ウェブサイトから申し込み手続きを進めることができます。

]]>
https://usortblog.com/xserver-free-domain2/feed/ 0 32955
ノンデザイナーの初心者でも簡単!アイキャッチ画像作成メーカー・ツールの使い方と魅力的なアイキャッチ画像の作り方 https://usortblog.com/how-to-easy-eyecatch-creator/ https://usortblog.com/how-to-easy-eyecatch-creator/#respond Mon, 19 Jun 2023 22:28:00 +0000 https://usortblog.com/?p=32824

アイキャッチ画像を画像編集ソフトで作るときに文字と背景を入れたいだけなのに、 だと思うことはありませんか? ゆーそうとITブログのアイキャッチ画像作成メーカーなら、画像をアップして文字を入力するだけであっという間にアイキ […]]]>

アイキャッチ画像を画像編集ソフトで作るときに文字と背景を入れたいだけなのに、

配置を細かく調整する必要があるのが面倒…

だと思うことはありませんか?

ゆーそうとITブログのアイキャッチ画像作成メーカーなら、画像をアップして文字を入力するだけであっという間にアイキャッチ画像やカバー画像などが作成できます!

ぜひ試してみてください!

アイキャッチ画像作成メーカー・ツールはSNSヘッダーやInstagramも作れます!

アイキャッチ画像作成メーカーでは基本的に画像やテキストのサイズを設定できるため、さまざまなプラットフォームに対応した画像を作成できます。

特に以下のアイキャッチ画像などは、画像やテキストのサイズをボタン一つでちょうどよくしてありますのでぜひご使用ください!

  • WordPressのアイキャッチ
  • YouTubeのサムネール
  • YouTubeヘッダー
  • Twitterヘッダー
  • Facebookカバー
  • Instagram

アイキャッチ画像作成メーカー・ツールでWordPressのブログ用にアイキャッチ画像を作成〜WordPressに指定する方法

ゆーそうとITブログのアイキャッチ画像作成メーカーを使ってWordPressのブログ用にアイキャッチ画像を作成〜WordPressに指定する方法をご紹介します。

この章ではまず簡単にアイキャッチ画像作成メーカーでWordPress用にアイキャッチ画像を作ってみます。

アイキャッチ画像作成メーカー・ツールの初期設定でアイキャッチ画像を作る方法

STEP
トップページorメニューから移動

ゆーそうとITブログのトップページにあるこのバナーかメニューの「アイキャッチ画像作成メーカー」をクリックしてください。

ここからでもOKです

STEP
【必須項目】アイキャッチに使う画像をアップロード

アイキャッチ画像作成メーカーのページに移動しました。

ファイルを選択をクリックして

使いたい画像を選んで「開く」をクリックしください。

STEP
【必須項目】アイキャッチ画像のテキストを入力

画像を選択できたら画像に表示したい文字を入力します。

STEP
画像とテキストができたらアイキャッチ画像を作成

STEP2の画像とSTEP3のテキストができたら、これでアイキャッチ画像を作ってみることができます!

「作成する」ボタンをクリックしてアイキャッチを作りましょう。

STEP
アイキャッチ画像をダウンロード

作成するボタンを押したら、アイキャッチ画像が作られました!

幅が700ピクセルだった時の表示も確認できます。

画像をダウンロードをクリックすると、今作った画像をダウンロードすることができます。 

アイキャッチ画像メーカーでTwitterのカバーやInstagramの画像を作成する方法はInstagramの説明で書いていますのでそちらもご覧ください!

アイキャッチ画像作成メーカー・ツールの初期設定の画像をカスタマイズする方法

「アイキャッチ画像メーカーの初期設定でアイキャッチ画像を作る方法」で作った画像を元にアイキャッチ画像をカスタマイズします。

STEP
【フォント設定】テキストのフォントデザインを調整

テキストの細かなデザインを変更します。テキスト設定を見てみましょう。テキスト入力のほかに、フォントサイズ行間フォント種類を変更することができます。

フォントの形を確認したいときは全フォントを表示をクリックすると、指定できる全てのフォントを見ることができるので好きなフォントを見つけましょう!

私はこのYuseiMagic-Regularがお気に入りなのでフォント種類で油性マジックレギュラーを指定します。

YuseiMagic-Regularのフォントを指定するとすぐにフォントの下に表示されている文字にもフォントの指定が適用されます。

これでフォントデザインを指定できました!

STEP
【デザイン設定】画像の透明度を変更

次からはデザインを変更します。

画像サイズの下に画面白レイヤーの透明度があります。これはアップした画像が目立ちすぎる時に、画像を半透明にしたいときに数字を指定します。

STEP
【デザイン設定】文字背景帯を調整

文字背景帯の色は白か黒を指定することができます。

文字背景帯の幅や高さも変更できます。今の帯の幅と高さを見てみて10%ぐらい減らしてみました。

他にも文字背景帯の透明度も変更できます。

STEP
【デザイン設定】枠線設定

枠線表示するをチェックすると画像の内側に枠線が表示されます。

その時の枠線の色はお好きな色に指定することができます。

これでデザイン設定は終了です!

これでデザイン設定は終了です!

STEP
デザインを調整

作成するをクリックするとこのようになりました!

初期設定と同じ画像とテキストでも、テキスト設定とデザイン設定でかなり違うイメージのアイキャッチになります。

テキストやデザインを修正したい時は作成完了画面のまま変更し直してください。

アイキャッチ画像作成メーカー・ツールで作った画像をWordPressに設定する方法

WordPressの投稿や固定ページなどの編集画面で、アイキャッチ画像作成メーカーで作った画像をWordPressのアイキャッチに指定します。

STEP
WordPressの編集画面で「アイキャッチ画像」をクリック

WordPressの編集画面で右のカラムにある「アイキャッチ画像」の「アイキャッチ画像を設定」をクリックします。

STEP
作成したアイキャッチ画像を選択

ファイルをアップロードタブでファイルを選択をクリックします。

先ほど作成してダウンロードした 画像を選択し、

「アイキャッチ画像を設定」をクリックしてください。

STEP
作成したアイキャッチ画像をプレビューで確認

プレビュー画面でアイキャッチを確認してみます。

アイキャッチが表示されました!

アイキャッチ画像作成メーカーでInstagramの投稿用画像を作成する方法

ゆーそうとITブログのアイキャッチ画像作成メーカーを使ってInstagramの投稿用画像を作成する方法をご紹介します。

この章では前提として「アイキャッチ画像メーカーの初期設定でアイキャッチ画像を作る方法」で作った画像を元にInstagram用を画像を作ります。そのため初期設定はこちらの項目をご確認ください。

STEP
簡単設定で「Instagram」をクリック

アイキャッチメーカーの簡単設定には色々な画像の大きさを設定できるボタンがあります。

この中のInstagramをクリックすると、画像サイズが1080×1080、フォントサイズが70になりました!

STEP
テキストの改行を調整

一旦画像を作成して作成した画像の状態を確認します。作成するとそのままの設定だと文字がはみ出してしまっているようです。

こういった場合はテキストの改行の位置を変えてみましょう。テキスト入力欄で改行を追加してみました。この状態で画像を作成してみます。

STEP
テキストのフォントデザインを調整

今度は文字のはみ出しがなくなりました!この状態でダウンロードしてInstagramにアップしてみてくださいね。

Youtube動画でアイキャッチ画像作成メーカー・ツールの使い方を解説

Youtubeのチャンネル登録もお願いします!

まとめ:アイキャッチ画像作成メーカー・ツールで簡単にアイキャッチ画像を作ろう

この記事のまとめです!

  • アイキャッチ画像作成メーカーを使用すると、画像とテキストだけで簡単にアイキャッチ画像やカバー画像が作成できる。
  • アイキャッチ画像作成メーカーは、WordPressのブログ用やSNSヘッダー、Instagramの投稿用画像などを作成できる。
  • アイキャッチ画像はダウンロードして利用できる。
  • アイキャッチ画像メーカーでは、テキストの改行やフォントデザイン、画像の透明度や文字背景帯の設定が可能。

ゆーそうとITブログのアイキャッチ画像作成メーカーを使って簡単にアイキャッチ画像を作ってみてください!

]]>
https://usortblog.com/how-to-easy-eyecatch-creator/feed/ 0 32824
「項目をゴミ箱へ移動する際にエラーが発生しました。」で下書きがゴミ箱へ移動・削除できない時の対処方法 https://usortblog.com/wp-garbage-in-error/ https://usortblog.com/wp-garbage-in-error/#respond Mon, 12 Jun 2023 22:49:53 +0000 https://usortblog.com/?p=32811

WordPressの投稿や固定ページを整理するためにタイトルがついてない投稿をゴミ箱に入れようとしたら 「項目をゴミ箱へ移動する際にエラーが発生しました。」というアラートが表示され ゴミ箱に移動することができませんでした […]]]>

WordPressの投稿や固定ページを整理するためにタイトルがついてない投稿をゴミ箱に入れようとしたら

「項目をゴミ箱へ移動する際にエラーが発生しました。」というアラートが表示され

ゴミ箱に移動することができませんでした。

今回は「項目をゴミ箱へ移動する際にエラーが発生しました。」でゴミ箱に入れられない原因やゴミ箱に移動する対処方法をご紹介いたします。

「項目をゴミ箱へ移動する際にエラーが発生しました。」で下書きをゴミ箱へ移動できない原因

(タイトルなし)の下書きをクイック編集で開きます。

すると、タイトルもスラッグも何も書かれていませんでした。

この部分が原因でゴミ箱に移動できなくなっているようです。

「項目をゴミ箱へ移動する際にエラーが発生しました。 で下書きをゴミ箱へ移動する方法

(タイトルなし)の下書きをクイック編集で開きます。

タイトルの項目に適当なタイトルを入力「更新」をクリックします。

この状態で「ゴミ箱へ移動」をクリックすると、

固定ページをゴミ箱に移動することができました!

まとめ

「項目をゴミ箱へ移動する際にエラーが発生しました。」で下書きがゴミ箱へ移動・削除できない時の対処方法のまとめです!

  • 「項目をゴミ箱へ移動する際にエラーが発生しました。」というエラーが発生した場合、下書きをゴミ箱に移動または削除できない。
  • ゴミ箱に移動できない原因は、タイトルが存在しないことにある。
  • タイトルのない下書きをクイック編集し、適当なタイトルを入力して更新すると、ゴミ箱に移動できるようになる。

同じように悩んでいる方のご参考になれば!

]]>
https://usortblog.com/wp-garbage-in-error/feed/ 0 32811
XserverのWordPress簡単インストールで出る「MySQLユーザーの追加設定可能な上限数に達しているため追加できません。」の原因&対処方法 https://usortblog.com/xserver-wp-install-error-mysql-user/ https://usortblog.com/xserver-wp-install-error-mysql-user/#respond Thu, 08 Jun 2023 23:12:00 +0000 https://usortblog.com/?p=32731

WordPressの簡単インストールを行おうとしたら「MySQLユーザーの追加設定可能な上限数に達しているため追加できません。」とアラートが出て、WordPressの簡単インストールができませんでした。 なぜWordPr […]]]>

WordPressの簡単インストールを行おうとしたら「MySQLユーザーの追加設定可能な上限数に達しているため追加できません。」とアラートが出て、WordPressの簡単インストールができませんでした。

なぜWordPressインストールができなくなったのか?を探ったところ、意外な落とし穴があったため、こちらを記事にしました!

XserverのWordPressの簡単インストールができなかった原因

XserverのWordPressの簡単インストールができなかった原因は先ほど貼り付けたこちらの「MySQLユーザーの追加設定可能な上限数に達しているため追加できません。」にハッキリと書かれていますが最初は「?」と思う方もいると思います。

なぜなら最近XserverはMySQLが無制限に作れますし、WordPressを削除するたびにMySQLまで削除する人にとってはMySQL自体もはそんなに多くないです。以下は当時のMySQL数です。

ということでここからXserverの仕様一覧を確認してみました。

https://www.xserver.ne.jp/manual/man_db_spec.php

するとMySQLのデータベースとは別にユーザー数が50という制限が書かれていました!

  • MySQL5.0が混在する場合は「30」となります。
なぜMySQLの数とMySQLユーザー数に違いがあるのか

WordPress簡単インストールをした独自ドメインからWordPressやMySQLを削除しても、MySQLのユーザーはそのまま残ります。

MySQLユーザーの確認方法

XserverのサーバーパネルからMySQL設定をクリックしてください。

MySQLユーザー追加のタブに移動して

MySQLユーザ一覧のスクロールバーがMySQL一覧より明らかに長く、数えると50個ありました!

MySQLユーザーを削除してXserverのWordPressの簡単インストールをする方法

ここからはMySQLを扱うため、間違えるとサイトを壊しかねません。くれぐれも自己責任の上ご作業ください。

MySQLユーザーを削除してXserverのWordPressの簡単インストールをする方法としては、MySQLが削除されてるにも関わらず、MySQLユーザーが残っているMySQLユーザーを探して削除したいと思います。

必要なMySQLとMySQLユーザーのデータをまとめる

STEP
MySQLユーザ一覧をすべてコピー

MySQLユーザーの確認方法でMySQLユーザ一覧を開いていると思いますので、MySQLユーザーの一番上の⇧ShiftをクリックしながらMySQLユーザーを一番下までドラックし、右クリックでコピーします。

STEP
新規スプレッドシートやExcelに貼り付け

コピーしたテキストは新しいタブで開いたスプレッドシートやExcelに貼り付けます。

画像例ではスプレッドシートで進めていきます。

STEP
MySQL一覧をコピー

Xserverに戻り、MySQL一覧をクリックします。

MySQLユーザー名の時と同じようにMySQL一覧を一番下までShiftを押しながら選びコピーします。

STEP
新しいシートにペースト

スプレッドシートやエクセルに戻り、新しいシートを作って

先ほどコピーしたデータベースを貼り付けます。

これで現在Xserverに存在するMySQLとMySQLユーザーの一覧ができました!

MySQLと紐づいているMySQLユーザーを探す

STEP
スプレッドシートのアクセス所有権ユーザをコピー

スプレッドシート、MySQL一覧のシートのC列「アクセス所有権ユーザ」2行目をコピーしてください。

STEP
MySQLユーザー名を探す

MySQLユーザー名のシートに行き、ショートカットキーのCtrl + F (MacはCommand + F)でページ内検索を行います。するとセルの色が変わります。

STEP
セルの色が変わった行を塗りつぶすか削除

「アクセス所有権ユーザ」として指定されているMySQLユーザーは消してはいけないので、

セルの色が変わった行を塗りつぶすか削除します。

これでMySQL一覧の2行目にあるMySQLとそれに紐づいたMySQLユーザ名を発見して処理しました。

STEP
MySQLに存在しないユーザー名だけが見えている状態に

MySQL一覧の3行目以降も同じように繰り返してください。
最後にはこのようになり、MySQLに存在しないユーザー名だけが見えている状態になりました。

XserverでMySQLユーザーを削除

STEP
MySQLに存在しないユーザー名をコピー

スプレッドシートのMySQLユーザのシートでMySQLに存在しないユーザー名の一番上のセルをコピーします。

STEP
XserverでMySQLユーザ一覧に移動

Xserverに戻りMySQLユーザ一覧に移動します。

STEP
一覧からMySQLに存在しないユーザー名を探し削除

スプレッドシートでの作業の時のようにCtrl + F (MacはCommand + F)でページ内検索を行い、該当のユーザー名の行の右側にある「削除」をクリックします。

STEP
MySQLユーザ削除の確認画面で削除

MySQLユーザを確認し「削除する」をクリックします。

STEP
削除完了

これで削除できました。スプレッドシート、MySQLユーザー一覧のシートのA3行目以降も同じ作業を繰り返すことでMySQLユーザーを整理できます。

改めてXserverのWordPress簡単インストールを行う

STEP
WordPress簡単インストールで確認画面へ進む

WordPress簡単インストールで必要な情報を入力し「確認画面へ進む」をクリックします。

STEP
問題なくWordPress簡単インストールを行えるように

さっきまでは出ていた「MySQLユーザーの追加設定可能な上限数に達しているため追加できません。」がなくなり、WordPressがインストールできるようになりました。

まとめ

この記事のまとめです!

  • WordPressの簡単インストール時に「MySQLユーザーの追加設定可能な上限数に達しているため追加できません。」というエラーが表示された。
  • Xserverの仕様を確認したところ、MySQLユーザー数には制限があり、50個までということが分かった。
  • WordPressやMySQLを削除しても、MySQLユーザーは残るため、簡単インストールができなくなる可能性がある。
  • MySQLユーザーの確認方法は、XserverのサーバーパネルからMySQL設定を開き、MySQLユーザ一覧を確認する。
  • MySQLユーザーを削除してXserverのWordPressの簡単インストールをする方法は、MySQLユーザ一覧をコピーし、新しいスプレッドシートやExcelに貼り付ける。それからMySQL一覧をコピーし、同じシートにペーストする。MySQLと紐づいているMySQLユーザーを探し、削除する。
  • MySQLユーザーを削除した後、改めてXserverのWordPressの簡単インストールを行うと問題なくインストールできる。

ぜひ同じような問題に遭遇している方の参考になりますように。

Xserverをまだ使ったことがない方はぜひお試し10日間を利用して使い勝手を体験してみてください!

]]>
https://usortblog.com/xserver-wp-install-error-mysql-user/feed/ 0 32731