Little Strange Software

スマホアプリの開発を行う LittleStrangeSoftware のブログです。

【はてなブログ】機能紹介記事・CSSカスタマイズ記事 まとめ

 どうも!LSSです!!

 

 結構、間があいてしまったのですが、

 

  

に続く「まとめ記事 第三弾」!!

 

はてなブログの機能の使い方やCSSカスタマイズについて、これまで書いた記事をまとめてみました。

 

なお、この「まとめシリーズ」は

 

にいただいたコメントが発端となっています^^

 

  

はてなブログで出来る事紹介編

はてなブログの機能を紹介したり、ちょっとした「こうすればできる」を紹介した記事です。

 

予想外のつまづき(動画について)

はてなブログに動画を貼ろうとして(YouTubeTwitterなど、はてな以外のアップローダーを使わず)苦戦した記事ですw

写真はいつも、はてなフォトを使っていますが、そこに音声ナシ動画を上げるには?という内容の記事ですね。

AviUtlというフリーソフトをつかってアニメGIF化すると、はてなフォトにアップできた!って内容です^^

 

ブログ記事のネタ探し

記事ネタが思いつかない時どうしよう?って時向けに書いた記事です。

はてなブログには「お題」があり、それにのっかる事と、Googleトレンドについて書いています。…って2つだけかwww

 

はてなブログで手軽なインデックス記事の作り方を考えてみました

これはちょっとひねってます^^

はてなブログには「記事検索」機能がついていますが、その検索結果画面のリンクを記事内にコピペする事で、「後から追記した記事も含まれる一覧」になる、って話ですね。

…っと、この頃はまだAndroidネタだったので、今ならCSSJavaScriptの一覧を作ったほうがいいかも??

 

はてなブログ「絵を描く」機能を使って、オリジナルゆるキャラを描いてみた!

存在を知らない人が多そうなwはてなブログ「絵を描く」機能について書いています。

使い勝手は…ですがw

 

【はてなブログ】アクセス解析について(スマホでの確認・言及の一覧)

はてなブログの「アクセス解析」、PCで見た時とスマホで見た時で見た目だけじゃなく機能も異なり、PC版表示した時は「言及の一覧」も確認できます^^

ついでに、スマホでそれを見る方法についても書いています。

 

 

はてなブログCSSカスタマイズ編

はてなブログ初心者向け はてなブログの記事でお手軽に文字に背景色をつける方法!

こんな風に、文章のバックに色をつけるのを、はてなブログ上で極力手軽にするには?って方法について書いていますw

 

ここのCSSをいじってみた話(ほぼコピペ)

この頃ですね。CSSを覚え直そうとしはじめたのw

はてなブログのデザインCSSをいじって、全体的な見た目を変更する方法について書いています。

 

このブログをレスポンシブ対応テーマにしてみました

LSSが はてなブログを始めた時に選択したテーマがレスポンシブ非対応だったので、それをレスポンシブ対応テーマに切り替えた時の話です。

テーマを変更すると、文字のフォントなども変わってしまうのをなんとか調節した、って内容ですね。

!important をつけてCSSの優先順位を上げたり、上部メニューのデザインをいじったりもしています。

 

「前の記事」「次の記事」のリンクを袋文字にしてみました:はてなブログCSSカスタマイズ

CSStext-shadow を使い、はてなブログの機能「前の記事」「次の記事」の見ため変更に挑戦した記事です。

 

 

コメント欄CSSカスタマイズ編

【CSS・はてなブログ】コメントボタンの文言をちょっと変えてみました【小ネタ】

はてなブログの「コメント欄」。

全てのブログで「コメントを書く」という同じ文言のコメントボタンがあり、設定画面で文言の変更ができないんですね。

それを「強引に変更しちゃおう!」という内容の記事になりますw

なお、LSSが試みたのは「前後に文字を追加する」だけでしたが、「まったく違う文言に変更する」という技を編み出された方がおられ、そちらへのリンクも↑の記事の最後に張っています!

※元々LSSがこれに挑戦したのは、別の方のブログ記事内容を見て、でしたが、そのLSSの記事を見てまた別の方がさらに挑戦された、という連鎖が面白いですね^^ 

 

【CSS・はてなブログ】「コメントを書く」ボタンの外観を変えてみた!

文言を変えたんだから外観も!という記事になります^^

2つ合わせて完全にオリジナルな「コメントを書く」ボタンになりますwww

 

【CSS・はてなブログ】今度はコメント欄の個々のコメントを装飾してみた!

ボタンに続き、個々のコメント欄の装飾をし始めています。

ここでは「コメント1つ」に対する全体的な指定ですね。

 

はてなブログのコメント欄の構造

ブラウザの「ソースを表示」では見られない、はてなブログのコメント欄の中身。

を「Webページ 完全」で保存すると見る事ができるようになります。

…という、調査だけの記事ですw

 

【CSS・はてなブログ】コメント欄、中身のデザイン

そして調査結果のまとめ、および、それに基づいてCSSでデザイン変更に挑戦してみました!

ここで書いた「コメント欄のクラス」は、これからコメント欄のデザイン変更に挑戦しよう!と思われた方の役に立ちそうなので、再掲します!

 

li entry-comment js-entry-comment comment-hatena-user コメント1件分の枠
p comment-user-name
img hatena-id-icon 投稿者のアイコン画
a comment-user-id
span comment-nickname
span user-name-nickname 投稿者名
span user-name-paren 投稿者IDの前の「(」
span user-name-hatena-id 投稿者ID
span user-name-paren 投稿者IDの後ろの「)」
div comment-content コメント本文
p comment-metadata はてなスター(この中にも色々ありますが省略)

   

 

あとがき

うん、前のまとめ記事から間が空きすぎですね

 

最近読者になってくださった方や、読者じゃないけどTwitterでフォローしてくださった方もおられるので、もしかしたら過去記事でも興味を持ってもらえる事もあるかも知れない??w

 

 

 

ってなとこで、今回はこのへんで!

次回もまた、よろしくお願いします^^