ど素人が、WordPressなし、HTMLとPHPだけでサイト構築をするブログ。サイト構築の中で役に立った小技も紹介しています。
|
https://twitter.com/kamenokoki |
|---|
「関連記事の投稿をおしゃれに表示したい」という課題に取り掛かって早5日目。スタイルシートは書き終えたものの、PHPでリンクを呼び出すことができなくて苦戦しています。今日はなんとかarraに関するエラーは回避できましたが…
関連記事をおしゃれに表示させるスタイルシートの設定は完了！今日は、関連記事の情報を呼び出してHTMLに格納していくPHPを作成していきたいと思います！「関連記事の投稿をおしゃれに表示したい」という課題に取り掛かって4日目です
「関連記事の投稿をおしゃれに表示したい」という課題に取り掛かって3日目になりました。今日はもう少し投稿をおしゃれにして、PHPでこの投稿を呼び出せるように構文を書いていきたいです。
昨日から取り掛かっている「関連記事の投稿をおしゃれに表示したい」という課題。昨日は辛うじて箱ができたので、今日はおしゃれに磨きをかけていこうと思います。画像の表示やテキストの表示も、それっぽくできました。
昨日までの1週間ちょっとで時間はかかりつつも日記のアーカイブページを完成させることができました！今日からはまた、やりたいことリストを消化していきたいと思いまず！まずは関連記事をおしゃれに表示するボックスの作成から取り掛かります。
【86日目】動きが重い日記のアーカイブを軽くしたい！-完成！
昨日はやっとアーカイブページが動かせるようになりました！今日はページ下部にも前月、次月のリンクを入れたり、存在しないページにエラーを表示する処理を行いたいと思います。そこまで行けば完成です
昨日成功したかに思えた日記のアーカイブ表示…。なぜか日付をうまく取得することができず、7日目に突入しました。今日こそ完成させたいです！PHPって難しいですね…
【32日目】GoogleとBingがサイトのエラーを教えてくれた
Google Serch ConsoleやBingに登録すると、サイトの悪いところをたくさん教えてくれます。今日は「モバイル ユーザビリティ」「Meta Description 」「Meta Language」などに対応しました
日記をアーカイブ形式に変更しようと格闘し始めて計6日目になりました。日記のアーカイブページとリンクを作り終わり、昨日からはアーカイブページに前月と翌月のリンクを入れようと頑張っています。
前の月と次の月へのリンクを作りたい！動きの重いPHPをやめ、日記をアーカイブ形式に変更しようと格闘し始めて計5日目になりました。今日は、日記のアーカイブページに前の月と次の月へのリンクを入れていきたいと思います。
動きの重いPHPをやめ、日記をアーカイブ形式に変更しようと格闘し始めて4日目になりました。今日は日記のトップページにアーカイブへのリンクを貼る作業を行いたいと思います！
80ページの存在の有無を判定しているだけのPHPがなぜか重いので、日記をアーカイブ形式に変更しようと格闘し始めて3日目になりました。今日は、ページの外観を整えて、アーカイブへのリンクなどを作っていきたいと思います。
PHPが悪さをしているのか、なんだか日記のアーカイブの呼び出しが重いんですよね…。78ページしかないのに。そんなわけで、アーカイブページを作って、日記のページは軽くしようと思います。これまで習ったPHPの応用でなんとか乗り切っています！
文末を「…」で終わらせる！「-webkit-line-clamp」の使い方
最新投稿などの文末を「…」（三点リーダ）で終わらせる方法、ご存じですか？「-webkit-line-clamp」を使えば簡単にできます！この記事では、line-clampをきれいに表示させるポイントを詳しく解説します！これさえ読めば、今日から「…」を実装できます！
やっぱり「最新投稿」の箱に詳細を入れたい！昨日はデザインがうまくいかなくて諦めた部分を「overflow」と「-webkit-line-clamp」で解決しました！さらに、トップページのデザインも、情報を得やすく変えていきます。お小遣いを稼げるブログを目指して43日目の出来事です
Windows10でスクリーンショットを取りたいとき、どうしていますか？ソフトなしでも、Windows10でスクリーンショットをとれる方法は色々あります。Windows10でスクリーンショットを取る方法を、ショートカットキーと、Windows10標準搭載の「Snipping Tool」に分けて詳しく紹介します！
Googleアドセンスの審査に通過してから、なんだかぼんやりしています。一つの山場を超えたような？次は収益化に向けていろいろと活動しないとなぁ。と言いつつ、今日は動きが重い日記のアーカイブを軽くする作業などをしています。
WordPressは有料なのか、無料で使えるのか。そして、レンタルサーバーや独自ドメインなど、ブログでお小遣い稼ぎをするために必要な環境を整えるために色々調べてみました。
【6日目】ロードマップを作ったり、サイトの作成に取りかかったり
お小遣い稼ぎができるブログを目指して6日目、今後の予定を立てるべく、ロードマップを作成しました。そして、人生で初めてのPHPに挑んだり、スタイルシートをサイトに適用するなど、自作サイトならではの楽しさを味わっています。
お小遣い稼ぎができるブログを目指して6日目、今日はサイトの見栄えを整えるために、まずはヘッダー部分を自作しています。Flexboxなるものを使うと、こんなに簡単にサイトの見栄えを良くすることができます。サイトのアイコンを入手しました。
お小遣い稼ぎができるブログを目指して8日目、今日はサイトのメインとなる記事部分を作ります。HTMLの「nav」「article」「aside」「main」の正しい使い方も勉強しました。少しずつサイトが形になってきています
お小遣い稼ぎができるブログを目指して10日目、短いURL(パーマリンク)を操作する.htaccessを利用するためには、Apacheが必要なことを昨日はじめてしりました。今日はApacheをローカルで設定します
お小遣い稼ぎができるブログを目指して11日目、パーマリンクを試す前に、まずはクリックするリンクを画面に表示させたいと思います。PHPをつかって、最新の投稿5件のリンクを作成してみました
【77日目】ページの読み込みを遅くしているPHPを修正してみた
非推奨になっているPHP関数「strtotime」やPHPの「file_exist」、そしてCSSで「grid-gap」など、サイトの問題のある部分を修正する日になりました。サイトの表側には見えませんが、ページの読み込みなどに影響を及ぼしているそうです。
【76日目】姉妹サイトにTwitterカードと広告を入れてみた
昨日と一昨日で、こちらのサイトにGoogleアドセンスの広告を入れ、Twitterカードを作りました。今日は、姉妹サイトchallenge.kamenokoki.comに広告とTwitterカードを作成していきます！
3日前にGoogleアドセンスの審査に通過してから、Googleアドセンスを使い始めていました。1日目はアンカー広告しか表示されなかったので放置していたのですが、今朝何気なく見たら、文章の間に複数の広告が！それはもうひどい量が入っていました…。
昨日は時間切れになってしまって作成できなかったTwitterカードを今日は作成してみたいと思います。なんとか設定はできたものの、ローカルで試験ができません…。本番環境に上げるしかないのか。ドキドキしながら試験をしてみました！
Googleアドセンスに合格しても、サイトにはまだまだ問題点がたくさんあります。今日は、twitterカードを作るついでにindex.phpをきれいにしようと思ったのですが、index.phpをしただけで時間切れになってしまいました。Twitterカードはまた明日。
【71日目】検索したときに何を検索したか分かるようにしてみた
昨日はGoogle Adsenceに申し込んでみたのですが、まだ結果は来ていません。待っている間にサイトの修正などをしていきたいと考えています。やりたいことが山積みになっていますが、今日はまず、検索ボックスに現在検索している内容を反映できるようにしてみました。
サイト作成開始から70日目、今日はいよいよGoogleアドセンスに申し込んでみました。意外と簡単にできてしまって拍子抜けしました。それよりも、Google Lighthouseでサイト分析した結果が悪くてびっくり。明日からやることがたくさんあります
今日はサイトの利用者様向けのプライバシーポリシーページを作りたいと頑張っています。ネット検索しまくって、文言を作りました。それなりにおかしくない文章になったと思います。あと少しでGoogleアドセンスに申し込みができます！
昨日までの4日間で、開発記事をカテゴリーごとに分けられるようになりました。今日は、サイトマップページの作成をしたいと思います。サイトマップページと言っても画像もないテキストリンクだけのページなので、簡単に完了できました！
スタイルシートの変更時に「ブラウザキャッシュ」をなかったことにする方法
「サイトの外観を変えるために、スタイルシートを一新。満を持して新しいサイトをリリースしたら表示が崩れていて大慌て！」それはブラウザのキャッシュが原因です。悪さをしている「ブラウザキャッシュ」を回避して新しいスタイルシートを強制的に適用させる方法をご紹介します！「ブラウザのキャッシュをクリアしてください」とお願いする必要はもうありません！
3日前からサイトマップページの作成に取り掛かっています。今日こそカテゴリーごとのアクセスページを完成させたい！存在しないカテゴリーを404ページに飛ばしたり、ページの見栄えを整えたり、画像に頭を悩ませたりしましたが、完成しました！
一昨日から取り掛かっているサイトマップページの作成。記事をカテゴリーごとに分類しようとしていますが、一昨日は方針を決めるだけで終り、昨日はPHPの使い方を研究して終りました。今日は何とかカテゴリーページの完成までこぎつけたかった…
【12日目】リンクにPHP変数を埋め込んだ あるいは、PHPにHTMLのリンクを埋め込んだ
お小遣い稼ぎができるブログを目指して12日目、過去の投稿の一覧を作るために、日付を一日ずつ遡って、ファイルの存在の有無を調べる作業をPHPにやってもらえるようにしました！
お小遣い稼ぎができるブログを目指して13日目、短縮リンク（パーマリンク）を利用できるように、PHPでURLから変数を拾ってページをひぅうじできるようにしてみました。
お小遣い稼ぎができるブログを目指して14日目、長い紆余曲折を経て、パーマリンクをレンタルサーバーと同じように動かすためにはApacheの設定をしなければいけないということが分かりました。パーマリンクが機能するようになりました。
【15日目】.htaccessの設定完了！ナビゲーションバーに取り掛かる
お小遣い稼ぎができるブログを目指して15日目、やっと短縮URL（パーマリンク）を利用できるようになりましたが、.htaccessで設定しなければならないものがもうすこし残っています。今日はされを完了して、ナビゲーションバーの作成にとりかかりました
お小遣い稼ぎができるブログを目指して16日目、ナビゲーションバーの作成にとりかかりました。ナビゲーションバーには最新投稿5件へのリンクを入れたいのですが、PHPで日記の内容を表示するためには日記側に変数を指定しなければ行けないことがわかりました。作業が増えていきます…
【17日目】ナビゲーションバーがなんとか完成。新しいスマホも届いた
お小遣い稼ぎができるブログを目指して17日目、ナビゲーションバーに、PHPを利用して日記の内容を呼び込めるようになりました。おしゃれ（？）なボックスで囲うことにも成功しましたが、今度は日記本文の表示がおかしくなってしまいました…
お小遣い稼ぎができるブログを目指して18日目、内部転送（短縮リンク/パーマリンク）を達成したつもりが、存在しないページに飛んでも内容が表示されてしまう…。今日は404エラーページの設定に抵抗しました！そして、本文部分の作成にとりかかりますが…
お小遣い稼ぎができるブログを目指して19日目、ブログを自力で作成していると「画像はどのように表示するか」、「HTMLのコードを紹介したいときにはどうするか」など、たくさん考えることが出てきます。今日はその2つの課題に挑んでみました。いちおう成功しています！
【20日目】ブログタイトルをブラウザタブに反映できるようになった
お小遣い稼ぎができるブログを目指して20日目、自力でサイトを作成していると、前の記事や次の記事へのリンクも自力で作る必要があります。苦労しながらも、見栄えまで整えてみました！そして、ページのタイトルをブラウザのタブに反映することにも成功！
自作サイトのトップページ作成にとりかかった。サイト全体に適用できるスタイルシートや、最新投稿へのリンクを画像つきで作ってみた
今日は本腰を入れてサイトマップページを作成し始めました。昨日、記事をカテゴリーごとに分ける方針は決めたのですが、今日は実際にPHPで分ける手法について検索をしまくる一日になりました。
Text形式サイトマップsitemap.txtをPHPで自作する方法
Google Search ConsoleやBing Web Masterに登録できるサイトマップの中で一番作成が簡単な「sitemap.txt」。しかし、サイトを更新するたびに手入力するのは手間がかかります。そんなときにはPHPで自動更新できるようにしてしまいましょう！この記事では、PHPで「sitemap.txt」を作成する方法を0からご紹介します。
今日はサイトマップページを作る作業に進みます。しかし、記事をどのようにカテゴリー分けして、どのように表示させるかに頭を悩ませるばかりで全く先に進めません…。サイトの完成も近いと思いましたが、なかなか遠いみたいです。
姉妹サイト「亀のチャレンジ」もアップグレードしようと昨日から奮闘しています。テーマカラーは青と決まっていますが、そのほかの色がなかなか決まりません。今日もまた悪戦苦闘しております…。
今日は手つかずだった姉妹サイトの方もきれいにしていこうと思います。画像で作業中の変化を見ていくと、とっても面白いです。しかし、色々とPHPで作ったものだな、と自分でも感心しました。
「ブログリーダー」を活用して、亀の子さんをフォローしませんか？
指定した記事をブログ村の中で非表示にしたり、削除したりできます。非表示の場合は、再度表示に戻せます。
画像が取得されていないときは、ブログ側にOGP(メタタグ)の設置が必要になる場合があります。
