スマホを利用していると、いつの間にか内部ストレージのデータ容量が増えている場合があるかもしれません。 その場合、音楽ストリーミングアプリのデータの可能性があります。 今回は、スマホ・タブレットのSpotifyアプリで、キャッシュファイルを削除すると方法と、My MusicのデータをSDカードに移動する方法となります。 また、手順内で使用しているスマホはAndroidとなります。 【Spotify】キャッシュファイルを削除する方法Spotifyでキャッシュファイルを削除する手順は以下となります。 Spotifyを開きます。 ホーム画面にある設定アイコンを選択します。 設定画面となるので、ストレージの「キャッシュを削除する」を選択します。 確認画面が表示されるので、「キャッシュを削除」を選択します。 以上が、Spotifyでキャッシュファイルを削除する方法となります。 【Spotify】データ

今回はVisual Studio Code（以下、VSCodeと表記）で、HTMLの開始タグ・終了タグを同時に変更する設定方法の紹介となります。 【VSCode】HTMLの開始タグ・終了タグを同時に変更する設定方法プラグイン「Auto Rename Tag」 を利用する場合プラグイン「Auto Rename Tag」をインストールすると、HTML・XMLのタグ名を変更した際に、ペアとなるタグ名が自動的に変更できます。 VSCodeのプラグインをインストールする方法については、以下のリンク先を参考にしてみてください。 また、このプラグインのレビュー内に、「元に戻す」「やり直し」をする際に、履歴データが壊れるとの指摘がありましたが、筆者の環境では再現できませんでした。 VSCodeの設定を変更する場合（HTMLファイルのみ）VSCodeの設定を変更することで、HTMLファイルのみですが、タグ名

WordPressの投稿や固定ページなどの編集画面では、「メディアを追加」ボタンから画像を追加できます。 今回は、画像を追加する際のデフォルト設定（サイズ・配置・リンク先）を変更する、2つの方法となります。 「メディアモーダル」から変更する方法WordPressでは、投稿などの編集画面内にある「メディアを追加」を選択すると、画像を選択・追加できる「メディアモーダル」が表示されます。 画像を追加する際のデフォルト設定は、以下の方法で「メディアモーダル」から変更できます。 デフォルト設定を変更する方法メディアモーダルで画像を選択すると、右カラムに画像の情報が表示されるので、下部の方に「配置」「リンク先」「サイズ」の項目があります。 その項目をデフォルトにしたい値に変更します。それにより、次に画像を追加する際に、変更した設定で画像を追加できます。 メディアモーダルで画像を選択した際の右カラム下部

Visual Studio Code（以下、VSCodeと表記）では、サイドバーのエクスプローラーでワークスペース内などのファイル・フォルダを表示しますが、�今回は、そのファイル・フォルダの表示・非表示を切り替える設定方法となります。 【VSCode】ファイル・フォルダの表示・非表示を切り替える設定方法指定したファイル・フォルダを非表示にする方法以下の設定で、エクスプローラーで非表示にするファイル・フォルダを追加します。 VSCodeの画面左下にある歯車アイコンをクリックします。 表示されるメニューから「設定」を選択します。設定内の上部にある検索ボックスで、「files.exclude」を検索します。設定「files.exclude」が表示されるので、「パターンを追加」を選択し非表示にするファイル・フォルダのパターンを入力して「OK」を選択します。パターンの例追加するパターンは次のようなg

Visual Studio Code（以下、VSCodeと表記）は、Windows・Macなどで利用できる無料ソースコードエディタ。 VSCodeでは、複数の箇所に対して選択・カーソルを立てるマルチカーソルを利用できますが、今回は、そのマルチカーソルを利用して、ブロック選択や短冊選択と呼ばれる縦方向の選択後に、テキストを一括削除・入力する方法となります。 VSCodeでブロック選択をした状態 縦方向に選択（ブロック選択・短冊選択）する方法マウスでブロック選択する方法以下、Windows・Macそれぞれでマウスを使いブロック選択する方法となります。 Macの場合ブロック選択をしたい始点にカーソルを合わせます。shift + option を押しながら、ブロック選択をしたい終点にカーソルを合わせます。Windowsの場合ブロック選択をしたい始点にカーソルを合わせます。Shift + Alt を

Laravel Mixでは、指定したファイルが更新されたらブラウザを自動更新するBrowsersyncを利用できます。 今回は、Laravel Mixで、そのBrowsersyncを利用する方法となります。 また、今回の例ではLaravel Mix をすでにインストールしている前提としています。Laravel Mix のインストール方法などについては、以下のリンク先を参考にしてみてください。 【Laravel Mix】Browsersyncでファイル更新時にブラウザを自動リロードする設定Laravel MixでBrowsersyncを利用するには、まず、Laravel Mixの設定を行えるwebpack.mix.jsファイルに、Browsersyncの設定を追記します。 Browsersyncの設定例｜webpack.mix.js以下、webpack.mix.jsファイルにBrowsers

Square（スクエア）は、決済システム・業務管理・オンライン販売などを一元化して利用できるサービス。 Squareにはさまざまな種類のAPIがあり、管理している商品の情報はCatalog API で扱えます。 今回は、そのCatalog APIを、Google Apps Script （GAS）で利用して、スプレッドシートからSquareに新規商品データを追加する簡単な例となります。 また、GASの基本的な利用方法については、以下のリンク先参考にしてみてください。 スプレッドシートからSquareに新規商品データを追加する例例では、Catalog APIを利用したGASを実行することにより、次のようなシートの情報から、Squareに新規商品データを自動で追加する例となります。 スプレッドシートの画面。例では「商品名」「バリエーション」「商品番号」「価格」の商品データをSquareに追加し

今回は、Googleアナリティクス（GA4）で、他のユーザーに対して、データ閲覧や編集などのアクセス権限を付与する方法となります。 【GA４】データにアクセスできるユーザを追加する方法アクセス権限の管理は、以下の方法で「アクセス管理」画面から行います。また、「アクセス管理」は、アカウント全体またはプロパティに対して設定できます。 Googleアナリティクスにログインをして、左カラムメニューの下部にある、「管理」アイコンを選択します。 管理画面となるので、「アカウントのアクセス管理」または「プロパティのアクセス管理」を選択します。アクセス管理画面となるので、右上にある「+」アイコンを選択します。メニューが表示されるので、「ユーザーを追加」を選択します。ユーザーの追加画面となるので、「メールアドレス」を入力し、「直接の役割とデータ制限」の項目を選択します。ユーザーの追加画面の右上にある「追加」

書籍についてコンピュータに関わる知識はさまざまで多岐にわたりますが、書籍『改訂新版 コンピュータの名著・古典100冊』では、コンピュータに関わるカテゴリーを11に分けて、書籍が紹介されています。 11のカテゴリーでは、「歴史」、「人物・企業」、「ドキュメンタリー」、「思想」、「数学／アルゴリズム」、「コンピュータサイエンス」、「アーキテクチャ／ＯＳ／データベース」、「コンパイラ／言語」、「プログラミング」、「ソフトウェア開発」、「インターネット」と歴史や人物に関する書籍から技術に関する書籍まで紹介されているので、興味のある名著・古典も見つかるのではないでしょうか。 書籍の目次 1 歴史 計算機の歴史 パスカルからノイマンまで誰がコンピュータを発明したかワークステーション原典UNIXの1/4世紀 インターネットの起源コンピュータ史 新装版計算機屋かく戦えりパソコン創世記 増補情報の歴史 象形

一部の Androidスマホやタブレットでは、文字入力で利用するキーボードアプリが、Googleが開発した「Gboard」となっていると思います。 今回は、Gboardのキーボードのカラー・背景画像を変更する方法となります。 【Gboard】キーボードのカラー・背景画像を変更する方法キーボードを表示し、上部メニューにある「パレット」ボタンを選択します。 テーマの画面となるので、変更したいテーマを選択します。（任意の画像を設定する場合は、「マイテーマ」から画像ファイルを選択します） テーマを選択すると、確認画面となるので「適用」ボタンを選択します。 テーマ確認画面。「キーの外枠」オフにすることも可能上記手順により、Gboardのキーボードのカラー・背景画像を変更できます。 上部メニューに「パレット」ボタンがない場合上部メニューに「パレット」ボタンがない場合は、以下のリンク先を参考にしてみてく

【WordPress】コメント一覧のHTMLをカスタマイズする例WordPressには、ツリー状のHTMLデータ構造を処理するWalkerクラスがあり、コメント一覧のHTMLは、Walkerクラスを継承しているWalker_Commentクラス内で処理されています。 また、Walker_Commentクラスはwp-includes/class-walker-comment.phpファイルで定義されています。 例では、そのWalker_Commentクラスを継承したサブクラスで、コメント一覧のHTMLをカスタマイズします。 カスタマイズする箇所以下、例でカスタマイズする箇所となります。 コメント投稿者名のフォーマットを変更コメント投稿者のアバターを削除コメント日時のリンクを削除コメント時刻を削除コメントリプライボタンを削除コメント本文内でHTMLタグの利用不可一部のHTMLタグを変更一部のc

今回は、ローディング中などに表示する、くるくる（スピナー）をCSSだけで、シンプル・簡単に作成する方法となります。 CSSで作成するスピナー（くるくる）の例以下、ソースコードの例となります。 See the Pen vRKwev by yic666kr (@yic666kr) on CodePen. CSSの説明上記CSSのポイントとなる箇所は、スピナーとする要素に指定した以下のプロパティとなります。 width・heightプロパティを同じ長さの値とする。borderプロパティを指定し、要素の1辺のみ違う色にする。border-radiusプロパティを50%とする。animationプロパティで要素を回転させるアニメーションを指定。animationプロパティについてanimationプロパティで指定した値は順に以下となります。 @keyframesと紐付ける任意のアニメーション名アニメ

今回は、Googleカレンダーの共有やGoogleカレンダーAPI（Calendar API）で利用する、カレンダーIDを確認する方法となります。 【Googleカレンダー】カレンダーIDを確認する方法Googleカレンダーのページへアクセスします。左カラムにある「マイカレンダー」の中から、カレンダーIDを確認したい「カレンダー名」をマウスオーバーします。そうするとメニューが表示されるので選択します。 メニューの中から「設定と共有」を選択します。 カレンダーの設定が表示されるので、下部の方にある「カレンダーID」の項目からカレンダーIDを確認できます。 「カレンダーの設定」画面の下部以上がGoogleカレンダーのカレンダーIDを確認する方法となります。

今回は、X API（旧Twitter API）を利用して、スプレッドシートに入力したテキストをランダムで投稿する、簡単なGASの例となります。 スプレッドシートを作成まずは、スプレッドシートを作成してシート名を「sheet01」とします。そしてシート内のA1〜A5セルに投稿したいテキストを、それぞれ入力します。 GASのプロジェクト（スクリプト）を作成上記のスプレッドシートに紐付いたGASのプロジェクトを作成します。 GASでは、シート名「sheet01」のA1〜A5セルから、1つのセルの値をランダムで取得してツイできるようにします。 また、GASの基本的な利用方法については、以下のリンク先参考にしてみてください。 X APIを利用する準備認証情報を確認APIを利用するTwitterアカウントで Twitter Developers にログインし、追加したAppの「Keys and tok

Androidスマホやタブレットで接続しているWi-Fiを、他の端末でも利用したい場合があるかもしれません。 今回は、接続中のWi-FiのQRコードをAndroid端末で表示して、そのQRコードを他のスマホなどで読み取ることにより、簡単に同じWi-Fiに接続する方法となります。 【Android】接続中のWi-FiをQRコードで共有する方法Androidの機種・OSのバージョンによっては方法が異なる可能性があります。（手順内の機種はAQUOS sense4 lite・Android 11） Androidの「設定」アプリを開きます。 設定画面となるので、「ネットワークとインターネット」を選択します。 ネットワークとインターネットの画面となるので、「Wi-Fi」のスイッチをタップして有効の状態にします。 「Wi-Fi」を選択します。 Wi-Fiの設定画面となるので、接続済みのWi-Fiネット

以下、そのぞれのinsertAdjacentText()の例とます。 要素内の先頭・後尾に追加する例以下の例では、idの値にexampleをもつ要素内の先頭と後尾に、テキストを追加しています。 <script> document.addEventListener('DOMContentLoaded', function(){ const element = document.getElementById('example'); // 要素内の先頭に追加する場合 element.insertAdjacentText('afterbegin', '要素内の先頭'); // 要素内の後尾に追加する場合 element.insertAdjacentText('beforeend', '要素内の後尾'); }); </script> <div> <div id="example"> <p>コンテンツ

HTMLには、プルダウンメニューの中から項目を選択できるセレクトボックスがありますが、今回は、そのセレクトボックスで選択中の項目を、JavaScriptを利用して変更する方法となります。 【JavaScript】セレクトボックスで選択中の項目を変更する例以下の例では、idの値にselect_boxをもつselect要素に対して、選択中の項目を、上から3番目の項目に変更しています。 document.addEventListener('DOMContentLoaded', function(){ var select = document.getElementById('select_box'); var options = select.options ; options[2].selected = true; }, false);上記コードでは、取得したselect要素に対してoptio

Androidスマホを使用していると、再起動の画面が終了しない場合などに、スマホの電源を強制的に切り、電源を入れ直したい場面があると思います。 今回は、そのような際に利用できる方法の紹介となり、スマホの電源を強制的に切る強制終了をして、電源を入れ直す方法となります。 また、紹介する方法は、富士通arrows M03・M04などのアローズシリーズでの方法となります。 強制終了して電源を入れ直す方法｜arrows（アローズ）M03・ M04強制終了の方法「電源キー」と「音量上キー」を同時に8秒以上押下します。（M04の場合は10秒以上） ※強制的に電源を切るため、操作中の内容などが消えてしまう可能性があります。 arrows M03の横側にあるボタン。短いボタンが「電源キー」。長いボタンの上側が「音量上キー」電源を入れ直す方法一度「電源キー」から手を離した後、「電源キー」を2秒以上押下します。

WordPress管理画面内には「投稿」を管理できる「投稿一覧」がありますが、今回はその「投稿一覧」内のカラムを追加・削除する例となります。 WordPress管理画面内の「投稿一覧」画面。今回の例では、この投稿一覧のカラムをカスタマイズします 投稿一覧のカラムを追加・削除する例今回の例で追加・削除する投稿一覧のカラムは以下となります。 カラムの最後に「項目01」を追加し、カスタムフィールドのキーsample_field01の値を表示「作成者」のカラムの後に「項目02」を追加し、カスタムフィールドのキーsample_field02の値を表示「日付」のカラムを削除上記カスタマイズには、まず、フィルターフックmanage_posts_columns使用し、投稿一覧のカラムを追加・削除します。 次に、追加したカラムの内容を、アクションフックmanage_posts_custom_columnで設

WordPressでカスタムフィールドを管理するために、プラグインAdvanced Custom Fields（ACF）を使用している場合があると思います。 そのACFで、フィールドグループにカスタムフィールドをたくさん追加した場合、カスタムフィールドを追加した編集ページがとても長くなってしまい、項目を探したり入力したりする際に頻繁にスクロールをしなければいけません。 今回はそのような場合に、カスタムフィールドを整理して使いやすくする方法の紹介となります。 ACFのカスタムフィールドをタブを使い整理する方法例えば、以下の画像にあるようにACFでフィールドグループを作成し、投稿ページにカスタムフィールドを追加したとします。 ACFのフィールドグループ編集画面。投稿ページにカスタムフィールドを追加した例そうすると投稿ページの編集画面の下部には、以下の画像のようにカスタムフィールドが追加されると