マガジンのカバー画像

Octマガジン

72
Project Octメンバーのブログの一部をまとめたマガジンです。 ウェブのこと、地域のこと、自分自身のことなどを書かせていただいています。 気になる記事がある場合はぜひクリエ… もっと読む
運営しているクリエイター

記事一覧

縦横2560px以上の画像をアップロードする方法【WordPress】

※自分用の備忘録です WordPressは一辺が2561px以上の画像をアップロードすると自動的に2560pxにリサイズされてしまいます。 それ以上の画像をアップロードしたい場合は下記のコードをfunctions.phpに書き加える必要があります。 px制限の解除コードadd_filter( 'big_image_size_threshold', '__return_false' ); その他のWordPressに関する記事はこちらから

スキ
1

塩尻市の観光看板を制作しました!

先日まで長野県の松本市に住んでいました。 その松本市を南に車で走ったところにある 塩尻市に住んでいる人や、塩尻に魅了されて引っ越してきた 人達が面白くて松本から塩尻に何度も通っていました。 そんな中、看板制作のお話をいただいて、 塩嶺トンネルを抜けてみどり湖SAを過ぎて 北アルプスが開ける直前の左側の塩尻市の観光看板の リニューアルのためデザインさせていただきました! 塩尻市観光協会のFacebookに紹介していただいています! https://www.facebook.

スキ
5

GitHub Copilotの導入方法

※自分用の備忘録です Technical Previewの予約上記のリンクから予約を行います。 Technical Previewの予約にはGitHubのアカウントが必要です。 完了するとメールでお知らせがきますが、2022年6月現在、数ヶ月時間がかかるようです。 Visual Studio Codeに拡張機能をインストールVSCodeに「GitHub Copilot」という拡張機能をインストールします。 有効化するにはTechical Previewが認証済みのG

スキ
2

カスタムメニューがある時、ない時の判別【WordPress】

※自分用の備忘録です カスタムメニューが設定されている時にはハンバーガーメニューを表示し、設定されていないときはハンバーガーメニューを非表示にする方法です。 コードの全容 <!-- メニューがある時 --> <?php if (has_nav_menu('header-menu')) : ?> <button class="navbar-toggler" type="button" data-bs-toggle="

スキ
1

投稿ページ、固定ページのテンプレートを編集画面から変更する方法【WordPress】

※自分用の備忘録です テーマフォルダの中に専用のテンプレートファイルを用意しておくと、編集画面からそのテンプレートファイルを指定し使用することができます。 テンプレートの用意テーマの中に「example.php」を用意します。 「single.php」や「page.php」を複製し使用するとスムーズに用意ができます。 投稿ページで使う場合は「single-example.php」、固定ページで使う場合は「page-example.php」というファイル名にしておくと管

スキ
2

head外に書いたを「link」をhead内に書き出す【WordPress/JavaScript】

※自分用の備忘録です WordPressなどで外部リソースを使う際、カスタムHTMLブロックに<link>を書きたくなる場合があります。 <head>外に<link>を記述をしてもほとんどのブラウザでは正常に機能します。 しかし、全てのブラウザで正常に機能する保証はありません。 W3Cのルール的にも<head>内に記述することが基準となっています。 WordPressなどのカスタムHTMLで<link>を使用する場合はJavaScriptで記述をしましょう。 <h

スキ
1

Local で WordPress の環境をローカルに作成する方法をご紹介します。

Local というツールを利用して WordPress の環境をローカル(自分のパソコン)に作成してみたら、とても簡単にサイトを作成、削除することが出来ることを実感しました。WordPress の作業や勉強が捗るので、楽しく継続できることにも繋がっていると思えます。 さらに、Local を利用して一番嬉しかったことは、「作成するサイトごとに PHP のバージョンが選べること!」でした。その理由は、のちほど書きたいと思います。まずは、インストールの方法からご紹介します。 ◆

スキ
17

自作テーマのサムネイル画像「screenshot.png」の設定

※自分用の備忘録です。 テーマの外観や詳細から確認できるサムネイル画像の設定方法です。 推奨サイズの画像を用意する「screenshot.png」の推奨サイズは「880 x 660 px」です。 公式のテーマなどでは「1200 x 900 px」なども使われていたりするので、高解像度にしたい場合はこちらのサイズを使用しても良さそうです。 用意する画像は、自作テーマを使用して作成したホームページのスクリーンショットなどがよく使われています。 画像のファイル名を設定する

スキ
1

信州の先端で最先端を叫びたい

みなさん、こんにちは。 Atelier Crown*Clown(アトリエ クラウン*クラウン)のかおりんです。 皆さんは登山にご興味はありますか? 私はありません。 登山が好きになるかどうかは「初めて山に登った時の経験が楽しかったかどうかに左右される」と聞いたことがあります。 その説の真偽はわかりませんが、私が「登山はイヤ!」というのはまさに子供の時の登山体験が原因です。 私の通っていた小中学校では、小学5年生の時に乗鞍登山、中学2年生の時に西穂登山というものをすること

スキ
9

検索フィールド「search.php」の設定【WordPress】

※自分用の備忘録です。 検索フォーム「searchform.php」の設定<form class="d-flex justify-content-center" method="get" id="searchform" action="<?php bloginfo('url'); ?>"> <input class="form-control me-2" type="text" name="s" id="s" placeholder="SEARCH" style="wid

スキ
2

reCAPTCHA v3をContact Form7に導入

※自分用の備忘録です。 reCAPTCHAにログインをするGoogleのアカウントでログインでき、無料で使用することができます。(有料版もあります) 導入したいサイトを登録するメニューにある「v3 Admin Console」に必要事項を記述し送信します。 ラベル「自分のサイトの名前などを入力します」 reCAPTCHAタイプ「reCAPTCHAタイプを選択します」 ドメイン「設定したいサイトのドメインを入力します」 オーナー「ログインしたGoogleアカウントの

スキ
2

JavaScriptのモジュール化(ファイル分割)

※自分用備忘録です。 importする側のscriptに「type="module"」を追加<script type="module" src="js/script.js"></script> exportvar pasta1 = peperoncino;var pasta2 = carbonara;export { pasta1, pasta2 }; 下記のようにも記述できます。 export var pasta1 = peperoncino;export var

スキ
3

アーカイブページの作り方(archive.php)【WordPress】

※自分用の備忘録です。 サンプルコードarchive.php <h1><?php the_archive_title(); ?></h1> <?php if (have_posts()) : while (have_posts()) : the_post(); ?> <div class="my-5"> <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>

スキ
3

「ロゴを動かしてみよう!」 SVGとアニメーション勉強会の記録です。

「ロゴのデータを利用して、アニメーションとして動かしてみよう!」勉強会に参加しました。制作の概要をご紹介したいと思います。 まずは、動く様子から。 ◆ 準備・ロゴデータを準備する 今回は、長野県松本市にあります、有限会社 アルプ様 のロゴをお借りして制作いたしました。本物のロゴを勉強素材としてご提供いただき、感謝の気持ちとともに緊張感も高まっています。不備のないよう最後まで書いていきたいと思います。 ・ロゴデータをSVG形式に変換する ロゴのデータはPNG形式でした

スキ
26