My Web道

WEB制作科 受講記録 …とその後も続くWEB制作に関する活動・学習記録です。

JavaScript 初心者にもおすすめ 10分でできるテキストカウンター

今日は、JavaScriptでテキストカウンターを作ってみました。 普段文章を作っていて、 「今、どれくらいの文字数なんだろう?」 って思う時がありますが、そんな時にはこうしたテキストカウンターがあると便利です。文字数の入力に応じてリアルタイムに入力文…

Contact Form7のコンバージョン計測方法紹介

「Contact Form 7」とは、 WordPressにメールフォームを設置するためのプラグインです。 ja.wordpress.org 今日は、WordPressのプラグイン「Contact Form 7」 のコンバージョンをGoogle Analytics で計測する方法についてお伝えいたします。 Google Analytic…

ブロガー専用テーマ「SWALLOWスワロー」をインストールしてみました

ブロガー専用テーマ「SWALLOWスワロー」のご紹介 「ブログを書くことに集中できる!」とかねてより評判の高かったブロガー専用WordPressテーマ「SWALLOWスワロー」をインスールしてみました。 ブロガー専用WordPressテーマ「SWALLOWスワロー」とは 以下、販…

Google Spreadsheet でカラーコード表を作成する

今日は、Google Spreadsheet でカラーコード表を作成する方法についてお伝えします。デザイナーさんが作成したカンプをコーディングで再現する作業過程で「使われている色がカラーコード表でまとめられていたら良いのに」と思い、こちらの方法にたどり着きま…

さくらサーバーで既存WordPressブログを常時SSL化、「接続は保護されていません」解決法手順紹介

今日は、さくらサーバーで既存WordPressブログをSSL化した際に起こった以下エラーの解決法をご紹介します。《Chromeの場合》 《Firefoxの場合》 【エラー内容】 SSL適用後にもかかわらず、アドレスバーに鍵のマークが表示されない。 代わりに「このサイトへ…

WordPress 失敗あるある - URL 変更時の注意点

今日は、WordPressでやってしまいがちな失敗の一つとして、 サイトURLを間違って変更してしまった場合の問題と対処法についてお伝えしていきます。 今回のお話の背景 先日、友人のWordPressサイトが突然正常表示されなくなるという現象が発生し、相談を受け…

超簡単!WordPressインストールまで3分で完了!(XSERVER簡単インストール編)

今日は、XSERVER(エックスサーバー)でのWordPress簡単インストールについてご紹介します。 XSERVERの簡単インストール手順 1. サーバーパネルにログインします。 サーバーパネル - ログイン | レンタルサーバー【エックスサーバー】 2. 「簡単インストール…

WordPressクイックインストール手順紹介 (さくらインターネットサーバー編)

今日は、さくらインターネットサーバーでのクイックインストール手順についてご紹介します。 さくらインターネット クイックインストール手順 1. サーバーコントロールパネルへログイン さくらインターネットのサーバーコントロールパネルにログインします。…

さくらインターネットサーバーでお名前.comの独自ドメインを設定するまでの手順

さくらインターネットでWordPressを設置するにあたり、 さくらインターネットサーバーにお名前.comで取得した独自ドメインを設定する手順を備忘録としてまとめました。以下、ご参照くださいませ。 1. さくらインターネット側 1.1. サーバーコントロールパネ…

無料でお試し可能! ワイヤーフレームツール「Prott」を使ってみました

Prott公式サイト: https://prottapp.com/ja/ Webサイトの制作をする際、ワイヤーフレームをなるべく簡単にサクッと作れたらって思います。今日は、そんな時にお役立ちのツール、「Prott」を使ってみたので、ご紹介します。 ワイヤーフレームツール「Prott」…

コーディング不要!ホームページ作成サービス「グーペ」でカフェサイトを作ってみました

今日は、ホームページ作成サービス「グーペ」のご紹介です。ホームページ作成サービス「グーペ」を使ってカフェのサンプルサイト を作ってみました。 デモサイト ※上記デモサイトでは、無料テンプレートの使用のみ、 特別な加工は何もしていない状態です。 …

【WordPress】Jetpackによる自動投稿ツイートでTwitterカードの画像が表示されない場合の解決法

本日は、WordPressからのツイッター自動投稿についてです。 連携しているTwitterで表題の問題が発生したため、解決法を確認してみました。 問題の現象 jetpackプラグインでWordPress記事更新時にTwitter自動投稿を行おうとすると、その結果投稿されたツイー…

WordPressのサイトURLを変更するには

今日は、WordPressのサイトURLを変更する方法についてお伝えします。 WordPressサイトURL変更について たとえば、サーバーの任意ディレクトリ(フォルダ)にインストールしたWordPressに独自ドメインを設定したい場合など、このような手順でサイトURLの変更が…

XSERVERでWordPressをインストール後の「このWEBスペースへは、まだホームページがアップロードされていません。」エラーについて

エラーの現象について XSERVERにWordPressをインストール後、 トップページにアクセスすると、 「このWEBスペースへは、まだホームページがアップロードされていません。」というエラーにより、トップページがまったく表示されません。WrodPressのインストー…

テキストや要素を簡単に上下中央揃えするCSS

今日は、テキストや要素を簡単に上下中央揃え(縦位置中央揃え)したい時に使えるCSSのご紹介です。今回の方法は、 「display:flex;」と「align-items:center;」 を使うのがポイントです。 「display:table-cell;」や「 vertical-align:middle;」で縦位置中央…