2024-09-01から1ヶ月間の記事一覧
画像編 burst.shopify.com girlydrop.com フリー画像, 無料画像, 著作権フリー画像, フリー素材 写真 O-DAN (オーダン）- 無料写真素材・フリーフォト検索 stock.adobe.com イラスト編 undraw.co www.openpeeps.com illust-navi.com www.linustock.com tyoud…
felica29.static.jp や
投稿記事で設定したアイキャッチ画像を取得するには、※まずfunctions.phpでアイキャッチ画像の機能をONにします functions.php // アイキャッチ画像を有効にする。 add_theme_support('post-thumbnails'); アイキャッチ画像を要素ごと取得 ですが、この取得…
Googleスプレッドシートにはスクリプトを埋め込む機能が付いています。今回はこの機能を使って、自動返信メールを送ってみます。 自動返信メールの本文を改行したい場合は「¥n」で「;」で本文が終了します。 function sendMailGoogleForm() { Logger.log('se…
タグライン 一杯のコーヒーから、街のつながりを メインコピー 池袋でコーヒーと音楽を楽しむ リード文 今年も池袋の街がコーヒーの香りで満たされます。全国の人気コーヒーショップが一堂に会し、こだわりの一杯を提供。コーヒー豆の販売や、バリスタによる…
以前授業でも使ったGoogleフォームですが、設置も簡単でスプレットシートと紐付けする事でお問い合わせ内容をデータベース化する事も簡単に出来てしまう、とても便利なツールですが、唯一の問題が「自分でCSSをいじれない」事です。特にレスポンシブサイトに…
プラグインを使ってデプロイさせます。デプロイとは「実行ファイルを実際のWebサーバー上に配置して、利用できる状態にすること」を指します。 ja.wordpress.org このプラグインは検索 & 置換操作中に発生する、あらゆるシリアライゼーションの問題も解決し…
img要素の表示方法は3通り １.「max-width:100%」を使ったフルードイメージ設定は一番簡単、幅と同じ比率で高さも低くなる ２.「object-fit」幅も高さも自由に指定、img要素の親要素に表示させたい幅と高さを指定、img要素には「object-fit:cover」と幅と高…
デフォルトでは「ウジェット機能」はoffになっているので、まずはfunctions.phpに「ウジェット機能」を有効にする記述をします。 アロー関数 「ウジェット機能」を呼び出す際に「=>」(ダブルアロー関数)というのが必要になります。ダブルアロー関数は連想配…
購入画面 <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>スマホ特化型サイトの作成|購入画面</title> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>…</link></link></meta></meta></head></html>
ポートフォリオ制作でまず自身が把握する事は中に入れるコンテンツの分量です。今までの授業で作ったデータをもう一度見直し、手直しする物は手直して、ポートフォリに掲載する物を決めましょう。 次にwebのポートフォリオを何で作るかを決めましょう。選択…
今回は合計金額の計算はJavaScriptを使用し、入力中にリアルタイムで合計金額が確認ができるようにします。ポイントは合計金額を表示するパーツと別に送信するためのinputが必要。値が入力されたら処理をする「oninput」イベントを使用します。 入力フォーム…
Google翻訳を使って日本語のサイトをマルチリンガル化します。自身のサイトのURLにパラメータを付けて翻訳ページを作成出来ます。 satori.marketing 日本語と英語と中国語にマルチリンガル化したサイト felica29.starfree.jp 自身のサイトのURLをパラメータ…
コンテンツのインポート まずはサンプルデータをダウンロードしましょう。www.shoeisha.co.jp ダウンロードしたサンプルデータをダッシュボードからインポートします。「ツール」→「インポート」→「WordPress」 ダウンロードした「posts.xml」ファイルを選ん…
GIFアニメーション（ジフアニメーション、GIF animation）は、Graphics Interchange Format (GIF) の「マルチイメージ」を使ったアニメーション。アニメーションGIF (animated GIF) ともいう。 一時はFlashや動画に取って変わられ見る事も少なくなりましたが…
通常のサイトであれば以前やったように各ページのg-nav liにcurrentというクラス名を付与すれば良いのですが、wordpressのようにナビゲーション部分をテンプレート化している場合、すべてのページのナビゲーションは同じnav.phpを呼び出しているので、wpテン…
WordPressとは wordpressとはヒューストンに住んでいた若者とイギリスに住んでいた若者がインターネットを通じてコラボレーションで開発を進めたオープンソースのプロジェクトです。2003年にリリース。 WordPressとは、オープンソースのブログソフトウェアで…
wordpressテンプレートタグを使う事で、静的なコンテンツを動的なコンテンツにする事が出来ます。wordpressテンプレートタグは1つ1つ目的が決まっているので、wordpressテンプレートタグの記述全てを覚えるのではなく、目的にあったwordpressテンプレートタ…
通常のCSS Gridではカード型レイアウトなどのアイテム（子要素）の縦位置を揃える事がとても難しく、コンテンツによってタイトルの文字数が異なる場合など、高さを指定しないとズレてしまいます。2024年9月現在、主要ブラウザはすべてsubgridに対応している…
作例入力画面 EFO（Entry Form Optimisation）は「入力フォーム最適化」の略で、入力フォームをユーザーにとって使いやすく入力しやすい形に最適化し、入力して内容を送信できるように改善を行う施策のことを指します。対面でのサービスが難しくなった今日「…
基本的にはJavascriptと同じですが、PHP独自のフォーマットをしっかりと覚えましょう。 １、「どのような形式で」を指定できる関数：date関数（フォーマット文字列）２、「いつの日付を」を指定できる関数：mktime関数（タイムスタンプ） timezoneの設定 本…
PHPでは情報を別のデータに受け渡すときにGETとPOSTの２つの方法（メソッド）が使われます。 GET GETメソッドはURLの末尾に「?」をつけ、「パラメーター名="値"」という形式でデータを送ります。そのせいで、URLにデータが表示されてしまい、誰からでも見る…
LT Lightning Talk（ライトニングトーク）とは ライトニングトークとは、英語でLightning Talkと書き「LT」と略されます。カンファレンスやフォーラムなどのプレゼンテーションで、3～5分程度の短い時間で発表する手法のこと。 トークイベントなどで十分な持…
index.html <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>スマホ特化型サイトの作成</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <header> <h1>Lorem, ipsum dolor.</h1> <p class="tag-line">Lorem ips…</p></header></body></html>
