ブログ

技術系ブログだと記事にプログラムの説明はつきもの。できれば、表示するプログラミング言語にあわせて、色を変えたり綺麗に表示したいですよね。 今回はブログ記事にソースコードを綺麗に表示させる方法を３つ紹介します。 この記事でわかること WordPres...

WordPressにはいろんなプラグインがあって、どれを使ったらいいのか迷ってしまうことありませんか？ 私がWordPressでサイトを作るときによく使うプラグインを一覧化しました。 私自身「あのプラグインなんだっけ〜(;´・ω・`」っと忘れるので備忘録です。 ...

みなさんは、Markdown記法ってご存知ですか？ ブログを書く、議事録を作るなど、ふだんから文章を書く人におすすめしたいTIPSです♪ この書き方に慣れると、文章作成のスピードがUPします。マークダウン（Markdown）記法をご紹介します。 私もこのやり方を...

Google Search Consoleをチェックしていたら、メールでこんなエラーが届きました。 「サーチコンソールに送信されているURLの中にnoindexを指定したページがある。」 これはどういう意味なのかな？と思って調べていました。 【エラーの意味】 noindexとは...

Webでよく使われる画像には、JPEG,PNG,GIF,SVGと種類があります。 ファイルの特徴を理解して使いわけることで、高画質のまま、ファイルサイズも小さくおさめることができます。 【Webで使う画像形式の種類】 ざっくりまとめると、こんな風に使い分けます。...

WordPressでは、たくさんのデザインがテーマとして公開されています。管理画面からカスタマイズできる以外にも、一部デザインを変更したいときもありますよね。 その際、子テーマを使うと、とっても便利です。 【テーマのカスタマイズに、子テーマを使う理...

ブログのアイキャッチを手軽に作りたい方にオススメ。画像作成サービスCanvaと、写真ギャラリーUnsplashを活用して、無料でおしゃれなアイキャッチを作りますよ。 【おしゃれな高品質写真はUnsplashから】 Unsplashという高画質な写真を無料提供しているサ...

タイトルWordPressブログサイト制作年月2017年より運営技術使用WordPress、SWELLURLhttps://0forest.com/対象範囲企画・デザイン・コーディング 当サイトでは、WordPressで作っています。 【過去の変遷】 現在はSWELLという有料テーマを使用して作成してい...

タイトルHoroscope Heart & Momstrologyさま制作年月2017年技術仕様WordPress、テーマ「Xeory」対象範囲環境構築、WordPressのセットアップ、操作レクチャーURLhttps://horoscopeheart.com/ 【サイトについて】 Horoscope Heart & Momstrologyのホ...

今回は、SourcetreeからのSSH接続するように直したので、その手順を記載します 私の環境(2021年8月時点) MacBook Pro (Retina, 13-inch, Mid 2014)MacOS Big Sur (ver 11.7)SourceTree(ver 4.1.2) 【①公開鍵と秘密鍵を作る】 ターミナルを開いて、「ssh-ke...

記事を書く時に、他のホームページやブログの文章を一部紹介したいことって、けっこうありませんか？ この記事ではコピペで使えるCSSのサンプルを５つ用意しました。 ブログやWordPressで引用符（blockquote)デザインを変える方法もご紹介します。 HTMLとC...

囲み枠は文章を枠でかこんだデザインのこと。 囲み枠は文章を枠でかこんだデザインのこと。 文章の中で囲み枠を設定すると、記事内で文章を目立たせたり、メリハリをつくることができます。 読者はふだん流し読みで記事を読んでいます。囲み枠で囲んである...

Node.jsとMySQLを接続して、データベースを動かす方法を説明します。 この記事でわかること MacでのMySQLの導入方法Node.js(Express)からMySQLデータベースに接続するプログラムデータベースから情報を取得して、表示するプログラム 前提 Macでの操作にな...

ホームページでよく出てくるパーツ「ハンバーガーメニュー」。 今回は、ハンバーガーメニューの作り方を紹介します。 【ハンバーガーメニューとは】 ハンバーガーメニューとは、スマホなどでのクリックすると開くメニューのこと。この３本線が、ハンバーガ...

Flexboxは、CSSはWebページのレイアウトを設定できるモジュール。 Flexboxを使うと簡単に整列したり、配置できるようになるので、ヘッダーなどのレイアウトに使われています。 今回の記事では、Flexboxを使ったヘッダーの作り方を紹介します。 【よくある...

トレースは、バナーや広告などの見本を、自分で再現しながらデザインを学ぶ練習手法です。 お手本通りに真似て作ることで、デザインの引き出しを増やしたり、ツールの使い方になれることができます。 【トレース＆模写におすすめの教材】 私は前に一度、ト...

ブログ記事を書いていると頻繁に登場するのが、箇条書き。項目を並べたり、まとめるのに便利で、わたしもよく使います😄 今回は、CSSコピペでできる、おしゃれなリストのデザインをご紹介します。 【リストの基本の書き方】 リストには「番号付き」と「番号...

HTMLとCSSで、フォームのラジオボタンやチェックボタンの代わりに画像選択にする方法の紹介です。 Before After 【HTMLとCSS】 <div> <input id="image_a" type="radio" value="image_a.jpg" name="image&quo...

アメブロを、おしゃれにカスタマイズしたい！ この記事では、アメブロのデザインをおしゃれにカスタマイズする方法を解説しています。 テンプレートそのままではなく、おしゃれでテンションのあがるブログにカスタマイズしちゃいましょう。 パーツごとに紹...

CSSのコピペだけで反映できる、簡単な見出しデザインを用意しました。フォントのサイズや色はご自由に変更ください。 【見出しを使うメリット】 見出しを使うと、記事の読みやすさがUPします。 記事の要点を読者に伝えることができる 読者が目的の情報を素...

WordPressにインスタグラムを表示させるプラグイン「Smash Balloon Social Photo Feed」がアップデートされました。あわせて、UIも大きく変わりました！ 改めて、使い方を解説していきます。 以前、使っていた方はアップデート後、Instagramフィードが表示...