Nakkan Base

投稿記事一覧

HTML5が廃止された件

No Comments

css/scss ブログ

HTML5が2021年の1月に廃止になっていたなんて、恥ずかしながら知りませんでした😅

現行は「HTML Living Standard」というものだそうです。

★どうしてHTML5が廃止されたのか

上記サイト様のこの記事にあるように、HTMLの歴史が関係しているようだけど、それはともかくとして、気になるのは「どのように変わるのか」ということ。

それをこちらのサイト様より抜粋させていただきます。

HTML5 と HTML Living Standardの違い

・<a href=""> をクリックしたときに、hrefのページに遷移しつつ、別URLにpingを送信するping属性の追加
・<img> の遅延読み込みを行う loading の追加
・autofocus が <button>や<input>以外の、全てのフォーカス可能な要素にも適用可能に
・<h1>は複数使用可能（ただし <section>も併用すること）

この中で、最後の「<h1>は複数使用可能」というのが私的には最も「おお〜」と思えました。

WordPressの投稿タイトルを<h1>にすることもOKな感じですね。

あと、テーマチェックでDEBUGを行った時に、

add_theme_support('html5');

がエラーになりました😱

なので削除してDEBUGを再度行ったのですが、これからは’html Living Standard’になるのだろうか。(長い💦)

まだCodexにも書いてなかったなぁ。

一度試してみればよかったかな?

ご存知の方がいらっしゃればご教授くださいませ🙇‍♀️

【WordPress】カスタムロゴの設置

No Comments

WordPress コード ブログ 基本

ロゴを設定するには、

=functions.php=

add_theme_support( 'custom-logo' );

と記述し、ロゴを設置したい場所に

(例)=header.php=

<header>
    <div class="header_head">

      <h1><?php the_custom_logo(); ?> <?php bloginfo('name'); ?></h1>

…

とするだけ。

これだけで
<a href=”トップページurl” class=”custom-logo-link” rel=”home”>
<img width=”○○” height=”○○” src=”画像URL” class=”custom-logo” alt=”○○○(メディアの「代替テキストで指定)” />
</a>

と書き出してくれます。

ロゴの大きさなどcssで指定するには、

=style.cssなど=

 .custom-logo {
    width: 20px;
    height: 20px;
    vertical-align: text-bottom;
  }

でOK。