CSS(シー・エス・エス) 【CSS】Grid Layout(グリッドレイアウト)で横縦縦縦の1×3のレイアウトを作る方法
以前にもGrid Layout(グリッドレイアウト)の話を書いたのですが、またまた分からなくなったので、改めて復習をしたいと思います。▼サンプルページはこちら基本「 display: grid; 」と書く Grid Layout(グリッドレ...
EGUWEB
CSS(シー・エス・エス) 
WordPress(ワードプレス) 「Ajax Load More」WordPressでインデックスページのコンテンツを無限スクロールできるワードプレスプラグイン
ワードプレスのブログ記事一覧ページは、記事の数が多いと「次のページ」といったボタンに切り替わって、「次のページ」を押すたびにページが切り替わります（テーマによりですが標準は）。このインデックスページを無限スクロールしたい場合に使える方法です...
CSS(シー・エス・エス) 【CSS】ボタンにマウスオーバーしたら画面いっぱいに要素が広がるアニメーションを作ってみる
ボタンにマウスオーバーしたタイミングで、要素が画面いっぱいに広がって埋め尽くす、といったアニメーションを作ってみます。▼demoページはこちらCSSでアニメーションを設定するまずは、ボタンを作ります。HTMLでdivボックスを作ります。<d...
Job(仕事) パートの場合、職業（しょくぎょう）と聞かれたらなんと答えればよいのか？
「パートで働いています」という時は、職業はなんと答えればよいのでしょうか？パートの場合、職業（しょくぎょう）と聞かれたら？雇用形態ごとに「職業」を分類するという方法があります。「サラリーマン」や「OL」などフルタイム勤務の場合は職業は「会社...
Scratch(スクラッチ) 【Scratch(スクラッチ)】変数と乱数を使ってスプライトをランダム表示させる方法（乱数の発生）
スプライト（１～５）を変数と乱数を使ってランダムに表示させる方法です。※プログラムサンプルはこちら（旗のボタンを押すとプログラムが実行されます）↑動画解説は上記Youtubeをご覧ください。まずはスプライトを作成するまずは、「スプライトを選...
WordPress(ワードプレス) An error occurred. Sorry,the page you are looing for is currently unavailable. が表示された場合
An error occurred. Sorry,the page you are looing for is currently unavailable.Please try again later.If you are the syst...
WordPress(ワードプレス) 「All-in-One WP Migrationプラグイン」WordPressのバックアップ＆サイトの引っ越しはAll-in-One WP Migrationが便利！本番サイト公開手順
ワードプレスには、様々なバックアップ＆お引越しプラグインがありますが、こちらの「All-in-One WP Migration」は簡単かつスムーズに、ワンクリックでバックアップやドメインの引越しをすることができる便利なプラグインです。プラグ...
WordPress(ワードプレス) 【WordPress】投稿記事に公開期限を設定する便利プラグイン｜Post Expirator
例えば「会員特典！１ヶ月限定公開」といったページを作りたいと思った時に、ワードプレスの標準機能に投稿の期間を限定する機能（一定期間後に非公開・下書きに戻す）といった設定は（知る限りでは）無いですが、もし実現したいと思った場合は、プラグインを...
WordPress(ワードプレス) 【WordPress】Unsplashからワードプレスのメディアに画像を１クリックでアップロードできる便利プラグイン！Instant Images – One Click Unsplash Uploads
unsplash.comさんはWEBサイトのモックを作ったりする際にとても役に立ちますが、WordPressで利用させていただこうと思った際には、一旦素材を検索して、メディアにアップロードして…という手間がかかります。そんな時は「Insta...
jQuery（ジェイクエリ） 【jQuery】Uncaught TypeError: $(…).on is not a function が表示される？
Uncaught TypeError: $(…).on is not a function jQueryが動かないと思ってConsoleを見ていると「Uncaught TypeError: $(…).on is not a function...
Marketing(マーケティング) 【WEBライティング】文章の不思議…なぜか読めてしまう文章｜タイポグリセミア(Typoglycemia)
いきなりですが、まずはこちらの文章をお読み下さい。こんちには みさなん おんげき ですか？ わしたは げんき です。この ぶんょしう は いりぎす の ケブンッリジ だがいく の けゅきんう の けっか にんんげ は もじ を にしんき す...
Mac(マック) 【Mac】Safari～ダウンロードしたzipファイルが自動的に解凍されてしまう場合の対処法
MacBookAirでzipファイルをダウンロードした時に起こってしまう問題のひとつが「zipファイルをダウンロードした時に自動で解凍されてしまう」という問題です。Macの便利機能でもあるわけですが、しかしzipファイルの状態でアップロード...
CSS(シー・エス・エス) 【CSS】疑似要素:before/:afterのcontent内で改行をする方法
「疑似要素:before」のcontent内で改行したい…と思ったときに、どうやって？という壁にあたったので、その方法について紹介したいと思います。white-space: preを使う改行したい位置で \A を入力し、white-spac...
SEO(検索エンジン最適化) ナレッジカード（Knowledge Cards）とは？SEOで押さえておくべきアンサーボックスについて
ナレッジカード（Knowledge Cards）とは？ナレッジカード（Knowledge Cards） とは、アンサーボックス（Google検索で通常の検索表示のURLやタイトルと別にページ最上部に回答が表示される部分）のひとつで、画面の右...
SEO(検索エンジン最適化) 【SEO】強調スニペットとは？検索でページの内容を記述したスニペット
SEOでよく出てくるキーワード「強調（きょうちょう）スニペット」とは一体・・・？強調スニペットとは？強調スニペットとは、Googleで検索した時にページへのリンクより先にそのページの内容を記述したスニペットが表示されているスニペットのことで...
WordPress(ワードプレス) 【WordPress】3D FlipBook プラグイン｜PDFを本を読んでいるようにページめくりができるようになる便利プラグイン！
ワードプレスでPDFを表示させたいときには、メディアにアップロードしてリンクを貼ればPDFファイルを開いてが閲覧できるのですが、3D FlipBook – PDF Flipbook Viewer, Flipbook Image Galler...
jQuery（ジェイクエリ） 【jQuery】JSの.onloadとjQueryの$().readyの違いについて
window.onloadとjQueryの$(document).readyは同じではないのか…？と思っていましたが、意味が違っていたようなので、その違いについて書いてみます。window.onload = function()target...
WordPress(ワードプレス) WordPressでgif画像が動かない（アニメーションしない）時に見るべき２つのポイント
このページに訪問している方は「wordpress gif 動かない」といったキーワードで検索された方が多いかと思います。おそらく原因は今回の２つのどちらかかな？と思われます。今回は、その場合の対処法についてご紹介をしていきます。メディアの画...
jQuery（ジェイクエリ） 【jQuery】画面をスクロールして画面に入った時に画像や要素をふわっと表示させる方法（CSS）
CSSで「要素が画面に入ったタイミングでフェードインしながらふわっと表示させたい」と思ったときに使える方法です。要素をふわっとフェードインさせたいと思ったときには、jQueryを使って表示させることができます。▶サンプルページはこちらscr...
WordPress(ワードプレス) 【WordPress】Imsanity｜画像をアップロードする時に自動リサイズしてくれる便利プラグイン！
WordPressで画像をアップロードするときにスマホで撮影した画像をそのままアップロードしてしまうとワードプレス本体の容量が気がついたら膨大なサイズになってしまう可能性があります。そんな時は「Imsanityプラグイン」を使って自動リサイ...
PremierePro(プレミアプロ) 【PremierePro】2021新機能の「自動文字起こし」機能を使う方法～音声を自動テキスト化できる新機能｜【自動テロップ作成】
プレミアプロの2021年版には新機能で「自動文字起こし」機能が搭載されています。今回はPremiereProの自動文字起こしを使ってみたいと思います。テキストパネル【新】新しく「テキスト」というパネルが登場しています。こちらが今回のプレミア...
CSS(シー・エス・エス) 【CSS】（蛍光ペン風）文字にマーカーが引かれたような下線デザインを作る方法｜background: linear-gradient
文字の下半分に「マーカーで引いたような線を入れたい」と思った時に使える方法です。CSSで簡単に加工できますので、ぜひお試しください。文字の下半分にマーカーのような線を引くbackground: linear-gradientを使います。li...
WordPress(ワードプレス) 【WordPress】Amazon LightsailでWordPressを公開するまでの流れについて（その１）
Amazon Lightsailを使ってWordPressを公開するまでの流れについてまとめてみました。Amazon Lightsailとは？Lightsail は使いやすい仮想プライベートサーバー (VPS) プロバイダーであり、アプリケ...
WordPress(ワードプレス) 【ワードプレス】ページ内におみくじアプリを作る｜JavaScriptで作るおみくじサンプルプログラム（part１）
WordPressで投稿ページ内に「おみくじを引く」のようなページを作りたいと思った時に「ボタンを押して結果を表示させる」くらいのページであれば、割と簡単に出来ますのでぜひ試してみてもらえればと思います。ボタンを作るまずは、クリックするため...
CSS(シー・エス・エス) 【CSS】背景画像に半透明のレイヤーを重ねる方法｜疑似要素::after
「背景画像を配置してその上に文字を配置」などをした場合、背景画像が明るすぎて文字が見えない…という場合もあるかと思います。そのような時に使える方法です。普通に画像に半透明の黒画像を重ねて画像化して配置しても良いのですが、それだと芸が無いのと...
WordPress(ワードプレス) 【ワードプレス】cocoonテーマで投稿ページ内の投稿者の表示部分を消す方法（追加CSS）
時折「cocoonテーマを使っている時に投稿記事の右下にある投稿者の表示部分を消したい…」というお尋ねがあります。（現時点では）どうやら非表示にする機能が無ようなのですが、CSSを使って消す（非表示にする）ことが可能です。追加CSSを使って...
CSS(シー・エス・エス) 【CSS】背景画像（background-image）を横幅100%に広げる方法【レスポンシブWEBデザイン】
「CSSで背景画像を画面幅いっぱいに広げたい」という時に使える方法です。背景画像を配置しただけでは、必ずしも画面幅いっぱいに広がる訳ではなく、no-repeatなどを指定した場合、左上の方に１枚ポツンと表示されてしまったりします。このような...
WordPress(ワードプレス) 【WordPress】画像のマウスオーバー時に表示画像を切り替える方法！プラグインなしでも可能
ワードプレスで「画像にマウスオーバーさせた時に画像が切り替わるようにしたい」と思う時もあるかと思います。そのような時に使える方法です。直接書く方法とプラグインを使う方法です。まずは、表示させる画像、マウスを乗せた時に切り替わる画像の２つの画...
GoogleSpreadsheet(スプレッドシート) 【Googleスプレッドシート】記事一覧からタイトルを抽出して表示させる便利な関数｜ IMPORTXML関数
「URLの一覧からすべてのページタイトルを一気に取得したい」という、こんな時に使えるのがGoogleスプレッドシート独自の便利関数「IMPORTXML関数」です。IMPORTXML関数とは？=IMPORTXML(“URL”, “XPathク...
WordPress(ワードプレス) 【WordPress】パーマリンク設定は要注意！全部のページが開けなくなるリスク有り！※途中での変更は基本NG！
「パーマリンク設定はくれぐれも気をつけましょう」という話をいつもさせてもらっているのですが、おそらくパーマリンクについて知らない方も少なくないかと思いますので、今回は改めて「パーマリンク設定」とは何か？についてと注意点をお伝えしたいと思いま...
