マガジンのカバー画像

Spearlyマガジン

27
最高のWeb制作・運用体験をお届けするWebサービス「Spearly」の公式マガジンです。 世界一簡単なヘッドレスCMS「Spearly CMS」と高速でセキュアな静的サイトホス…
運営しているクリエイター

記事一覧

初心者が今話題のヘッドレスCMSを使って1 からサイトを作ってみた〜コンテンツリスト埋め込み基礎編〜

はじめにみなさんこんにちは。Spearlyチームのライターもなんです。この記事は、プログラミング初心者の私がヘッドレスCMSである、Spearly CMSを使って1からサイト制作をする記事になっています。 このシリーズでは、サイト作成の全体的な流れはもちろん、ヘッドレスCMSの解説から実際の使い方まで解説しているのでぜひ、最後まで読んでみてくださいね◎ 🔻サイト作成の全体的な流れについては以下の記事で解説しています🔻 🔻前回の記事はこちら🔻 実際に手を動かす前に…Spe

初心者が今話題のヘッドレスCMSを使って1 からサイトを作ってみた〜単体埋め込み応用編〜

はじめにみなさんこんにちは。Spearlyチームのライターもなんです。この記事は、プログラミング初心者の私がヘッドレスCMSである、Spearly CMSを使って1からサイト制作をする記事になっています。 このシリーズでは、サイト作成の全体的な流れはもちろん、ヘッドレスCMSの解説から実際の使い方まで解説しているのでぜひ、最後まで読んでみてくださいね◎ 🔻サイト作成の全体的な流れについては以下の記事で解説しています🔻 🔻前回の記事はこちら🔻 実際に手を動かす前に…Sp

プログラミング初心者が今話題のヘッドレスCMSを使ってサイトを1から作ってみた〜単体埋め込み基礎編〜

はじめにみなさんこんにちは。Spearlyチームのライターもなんです。この記事は、プログラミング初心者の私がヘッドレスCMSである、Spearly CMSを使って1からサイト制作をする記事になっています。 このシリーズでは、サイト作成の全体的な流れはもちろん、ヘッドレスCMSの解説から実際の使い方まで解説しているのでぜひ、最後まで読んでみてくださいね◎ 🔻サイト作成の全体的な流れについては以下の記事で解説しています🔻 🔻前回の記事はこちら🔻 実際に手を動かす前に…Spe

Spearly CMS って一体なに?簡単すぎるヘッドレスCMSを徹底解説

はじめにみなさんこんにちは。Spearlyチームのライターもなんです。この記事は、プログラミング初心者の私がヘッドレスCMSである、Spearly CMSを使って1からサイト制作をするシリーズになっています。 このシリーズでは、サイト作成の全体的な流れはもちろん、コンテンツ作成、コーディング、サイト公開まで解説しているのでぜひ、最後まで読んでみてくださいね◎ さて、今回は実際にSpearly CMSを使う前に知っておきたい、キーワードや使い方を徹底解説しようと思います!ぜ

初心者が今話題のヘッドレスCMSを使ってサイトを1から作ってみた〜レイアウト構成編〜

はじめにみなさんこんにちは。Spearlyチームのライターもなんです。この記事は、プログラミング初心者の私がヘッドレスCMSである、Spearly CMSを使って1からサイト制作をする記事になっています。 このシリーズでは、サイト作成の全体的な流れはもちろん、コンテンツ作成、コーディング、サイト公開まで解説しているのでぜひ、最後まで読んでみてくださいね◎(今回はコンテンツ作成の前に必要なレイアウト構成を組みます!)また、Spearly CMSの具体的な使い方も解説します!)

サイト制作ってどうやるの?流れと使うべきサービスを徹底解説

はじめにみなさんこんにちは。Spearlyチームのライターもなんです。この記事は、プログラミング初心者の私がヘッドレスCMSである、Spearly CMSを使って1からサイト制作をする記事になっています。 このシリーズでは、サイト作成の全体的な流れはもちろん、コンテンツ作成、コーディング、サイト公開まで解説しているのでぜひ、最後まで読んでみてくださいね◎(今回はサイト作成の流れについて解説します!) 「サイト制作の流れが知りたい!」 「実際に手を動かしてサイトを作ってみた

サイズの小さい一覧表示用のサムネイル画像と、しっかり見せたい詳細表示用の画像をImageFluxを使って生成する

はじめに画像ギャラリーのようなページを実装する際に、一覧ではサイズの小さいサムネイル用の画像を、詳細表示には、オリジナルの高画質な画像を使うことはよくありますよね。 ※サムネイル画像 ※詳細画像 ※HTML5UPから引用 https://html5up.net/ サムネイル画像を用いるメリットは、ギャラリーなどで一覧性を保ちつつ、サイズの小さい画像を使うことで大量に表示しても読み込みに影響しないことなどが挙げられます。 しかし、画像の加工が必要なケースがほとんどです。

ImageFluxで簡単トリミング!

はじめに皆さん突然ですが、このような一覧表示を行うために正方形にトリミングしたいと思ったことはありませんか。正方形のイラストをこのようなレイアウトで設置するのは様々なサイトでよく見られますよね。 ※HTML5UPから引用 https://html5up.net/ 普通ならこんな作業が必要上のような画像を正方形にトリミングしたい時はみなさんはどうしていますか? 最初に思いつくのは、Photoshopなどの画像編集ツールで画像を編集する方法です。 しかしその場合、画像を編集

WebP変換でサイトを高速化

ImageFluxで簡単に画像変換!WebP変換でサイト高速化みなさん、突然ですがWebPという画像形式をご存じですか? WebPとはGoogleが開発した画像形式です。本来の画像の画質をほとんど保ちつつも、とても軽量なため、Webサイトでの利用に最適です。画像が軽くなるとページの読み込み速度が上がるのでSEOの面でもプラスに働きます。 しかし、便利な反面、変換に少し手間がかかるという側面も持っています。WebPに対応したソフトを利用し、WebPに変換するケースが一般的です。

【初心者向け】Spearly CMSの埋め込みタグを使ったサイト作りを徹底解説してみた〜単体埋め込み編〜

はじめにみなさんこんにちは!Spearlyチームのライターもなんです。この記事は、HTML・CSS初心者の私がSpearly CMSの「埋め込みタグ」を使ったコンテンツ作成について実際に手を動かしながら解説する記事になっています🌿 「埋め込みタグってなに?」「どうやって使うの?」 という方の参考になれば嬉しいです! また、Spearly CMSの基本的な機能についてはこちらの記事で解説しているので、ぜひこちらをご覧になってからこの記事を見ていただけると嬉しいです👀 埋め

Spearly CMSを使ってお問い合わせフォームを爆速で作成してみた

はじめにみなさんお久しぶりです。Spearlyチームライターの大河です。 みなさんSpearly CMSってご存知ですか? 私はこのサービスをもっといろんな人に知ってもらうために日々活動しています。 今回はそんな私が勉強の中でSpearly CMS凄い!!と感じたところをみなさんに知ってもらえたらと思います。今回は簡単に作成できる便利なフォームについての体験をみなさんに伝えたいと思います。 そもそもSpearly CMSって何?Spearly CMSとはコンテンツを管理、作

【コピペで使える】オプションパラメータの使い方まとめ

はじめにみなさんこんにちは。Spearlyチームのライターもなんです。この記事は、HTML・CSS初心者の私がSpearly CMSの新機能であるオプションパラメータについて解説する記事です。 「オプションパラメータってなに?」 「実際どうやって使うの?」 という方の参考になれば嬉しいです🌱 オプションパラメータってなに?オプションパラメータとは、コンテンツの絞り込みや並び順を変更することができる埋め込みタグです。 オプションパラメータを使うと、 特定のタグを持つコンテ

【初心者向け】itemタグとlistタグの違いと使い方まとめ

はじめにみなさんこんにちは。Spearlyチームのライターもなんです。この記事は、HTML・CSS初心者の私がSpearly CMSで出てくるitemタグとlistタグの違いと使い方について解説する記事です。 「itemタグとlistタグって何が違うの?」 「埋め込むときの使い分けがいまいち分からない…」 という方の参考になれば嬉しいです。 また、この記事は以下の記事の補足になるので、こちらを読んでから見てくださると嬉しいです🌿 itemタグとlistタグの違い埋め込み

【初心者向け】Spearly CMSのカスタム埋め込みを使ったサイト作りを徹底解説してみた〜一覧表示編〜

はじめにみなさんこんにちは!Spearlyチームのライターもなんです。この記事は、HTML・CSS初心者の私が、Spearly CMSの「カスタム埋め込み」を使ったコンテンツ作成について解説する記事になっています🌿 「カスタム埋め込みってなに?」「どうやって使うの?」 という方の参考になれば嬉しいです! また、Spearly CMSの基本的な機能についてはこちらの記事で解説しているので、こちらをご覧になってからこの記事を見ていただけると嬉しいです👀 カスタム埋め込みの前