タグ: WordPress

  • [HTML]サイトアイコン(ファビコン)を設定します

    [HTML]サイトアイコン(ファビコン)を設定します

     ウェブサイト毎に独自のアイコンが設定されているサイトを目にしますが、ワードプレスのアイコンをそのまま使っているサイトも見かけます
     このアイコンを変更してみましょう

    画像

     サイズが異なる画像(シンボル)がいくつか必要になります

    favicon.ico(ふぁびこん)

     縦横ともに48ピクセルの画像で用意します
     ファイルをFTPでサイトのルートフォルダに保存します
    例:www.commuply.co.jp/favicon.ico

    apple-touch-icon.png

     縦横ともに180ピクセルの画像で用意します
     ファイルをFTPでサイトのルートフォルダに保存します
    例:www.commuply.co.jp/apple-touch-icon.png

    サイトアイコン

     縦横ともに150ピクセル以上のアイコンを用意しましょう
     検索エンジンは48ピクセルの倍数がよいそうなので、48ピクセルの4倍にあたる192ピクセルにします

    HTMLファイルのばあい

    HTMLの<head>の中に次の行を書きます。

    <link rel="icon" href="/favicon.ico.ico"><link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">

    WordPress(ワードプレス)のばあい

     [メディア]に192ピクセルの画像と512ピクセルの画像を登録します
     512ピクセルの画像を、[設定]-[一般]にある[サイトアイコン]に設定します
     192ピクセルの画像を、[外観]からテーマの[サイトアイコン]を設定します。テーマ毎に具体的な設定場所が異なります

     [Ogp Plus]プラグインを登録して、デフォルトOGP画像に192ピクセルの画像を登録します

     [Head & Footer Code]プラグインを登録して、[HEAD Code]欄に次のコードを登録します

    <link rel="icon" href="/favicon.ico.ico"><link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">

    BaserCSM(ベーサーシーエムエス)のばあい

    サイトのフォルダ/app/webroot/favicon.icoを更新します。

  • [WordPress]テーマの使用例

    [WordPress]テーマの使用例

    WordPressのテーマを何ににするかで見た目が変わってきます
    カミュプリィが使った(使いたい)テーマを紹介します

    コーポレートサイトTwenty Twenty-Four
     過去にはCocoonを使ったことがあります、 新しくXWRITEという有料テーマが開発されているようです
     WordPress以外では、メモ帳でHTML・CSSを手書きしたり、Wixでホスティングしてもらったり、baserCMSだったりしたこともあります

    社内規定:Luxeritas
     会社の就業規則などの各種規定を公開するサイトで使っています、 労働条件通知書でURLを案内しています

    カミュプリィの雑多なメモTwenty Twenty-Five
     このサイトです

    ハコページ(hakopage)Lightning
     ハコページでは有料テーマを使っています


  • [WordPress]テーマを自作する

    [WordPress]テーマを自作する

    新しいテーマのファイルを配置

     WordPressをインストールしたフォルダのwp-content/themesフォルダに、テーマのフォルダを作成します
     テーマのフォルダ名はWordPressの管理画面に表示されます
     レンタルサーバの簡単インストールで作成されたWordPressでも大丈夫です

    作成したテーマのフォルダに次のファイルを新規作成します
    FTPが必要です

    functions.php : 中身は不要です

    readme.txt : 中身は不要です

    style.css : UTF-8で次のように記載します

    /*
    Theme Name: カミュプリィのテーマ
    Author: Commuply Inc.
    Description: 自作テーマです
    Version: 0.0
    */

    index.php : UTF-8で次のように記載します
    (投稿を表示するために必要ですが、templates/index.html を置く方法もあります)

    <?php get_header(); ?>
      <div>
        <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
          <h2>
            <a href="<?php the_permalink(); ?>">
              <?php the_title(); ?>
            </a>
          </h2>
          <?php the_content(); ?>
          <?php endwhile; endif; ?>
      </div>
    <?php get_footer(); ?>

    screenshot.png : テーマを表示する画像を横880 x 縦660 または 横1200 x 縦900 で配置します

    自作テーマに切り替え

    WordPressの管理画面で 外観 > テーマ で切り替えます

    自作テーマのチェック

    Theme Check」プラグイン(作者: Themes チーム)を追加します

    外観 > Theme Check、もしくは テーマの画像が大きく表示されているところにある「Theme Check」ボタンからチェックできます

  • [WordPress]投稿を更新日順にする

    [WordPress]投稿を更新日順にする

    ワードブレス(WordPress)の標準テーマ「Twenty Twenty-Five」で、新しい投稿から順に表示されるようにする方法です

    1. WordPressの管理画面へログインします
    2. 左側の「ツール」を選び、右側の「Theme Functions (functions.php)」を選びます
    3. 真ん中のファイルの内容の一番下に次のコードを追加します
    /**
     * 記事の並び順を更新日にする
     */
    function sort_post_asc($query) {
      $query->set( 'orderby', 'modified' );
    }
    add_action( 'pre_get_posts', 'sort_post_asc' );

    テーマ毎のファイルを更新するため、テーマが更新されたり、テーマを変更すると初期化されます

  • [WordPress]サイトアドレスを変更

    [WordPress]サイトアドレスを変更

    既存のWordPressを更改するために、サブフォルダをつくって作成し、最後にURLをドメイン直下へ変更して表示を切り替える方法です

    WordPress >> サイトアドレス (#1)

    WordPress >> 設定 >> 一般 >> サイトアドレス を変更して保存します

    WordPress >> WordPress アドレス (#2)

    WordPress >> 設定 >> 一般 >> WordPress アドレス にある「.htaccess」と「index.php」を取得します

    サイトアドレス (#1) にアクセスしたユーザーを WordPress アドレス (#2) へ

    WordPressは、WordPressが入っている WordPress アドレス (#2) のファイルを更新しますが、その外にある サイトアドレス (#1) を更新しません

    ブラウザーからサイトアドレス (#1) にアクセスしたら、WordPress本体がある WordPress アドレス (#2) を案内する設定が求められます

    index.php

    WordPress アドレス (#2) を案内するファイルです

    サイトアドレス (#1) に index.php がなかったら、WordPress アドレス (#2) からコピペします そして次のところを書き換えます

    (旧)
    require __DIR__ . '/wp-blog-header.php';
     ↓
    (新)
    require __DIR__ . '/サブフォルダ/wp-blog-header.php';

    .htaccess

    優先順位の設定をいれるファイルです

    サイトアドレス (#1) に index.php がなかったら、WordPress アドレス (#2) からコピペします そして DirectoryIndex に続けて index.php を記載して、 index.php が最優先で開かれるようにします

    (旧)
    DirectoryIndex index.html
     ↓
    (新)
    DirectoryIndex index.php index.html

    こちらの記事が参考になるかもしれません:.htaccessファイルの使い方