Oh!Happy.JP

さくらのVPS1GでWordPressブログはじめました

Plone4のロゴ変更

さくらインターネットさんのさくらVPS1Gにインストールした「Plone4」のロゴを変更しました。以下、私が行った手順です。

Plone4のロゴ変更

  • FunnyLogoというサイトで以下のようなGoogleっぽいロゴを作成し、「logo.png」という名前のpngファイルを作成しました。
  • 自分のPlone4サイト右上にあるログインをクリックしてに管理者「admin」でログインしました。
  • Plone4サイト右上に表示された「admin」をクリックして表示されるドロップダウンリストメニューから、サイト設定を選択クリックしました。
  • サイト設定画面のPlone設定からZope管理インターフェース(ZMI)を選択クリックしました。
  • Zope管理インターフェース(ZMI)で、portal_skinsを選択(クリック)しました。

  • portal_skinsにあるplone_imagesフォルダを選択(クリック)しました。
  • plone_imagesフォルダにあるlogo.pngを選択(クリック)しました。
  • /portal_skins/plone_images/logo.png のCustomize画面になったので、「Customaize」ボタンを選択(クリック)しました。
  • ファイルのアップロード画面となったので、File Dataに作成したlogo.pngを指定し、適当なTitleを付けてロゴファイル(logo.png)をアップロードしました。
  • ロゴの表示がアップロードしたロゴファイル(logo.png)に変更されたことを確認しました。
  • 最後にブラウザで自分のサイト(metabo.ohhappy.jp)を表示し、ロゴが変更されたことを確認しました。

MODXとAmazonで簡単にネットショップを開店してみた

Wordpressのマルチサイト化を試した際に、Amazon アソシエイト (アフィリエイト)インスタントストアをWordPressのページ内にiframe形式で組み込んだ『Amazon.Oh!Happy.JP』というショッピングサイトを作成しました。

MODX Evolution』というCMSを使用すると、スニペットという機能でPHPで作成したプログラムを簡単に取り込めるので、『Amazon.Oh!Happy.JP』と同じように簡単にショッピングカートを持ったネットショップが出来るではないかと思い、試しにサイトを作成してみました。

実際に作成したサイトは、『Shop.Oh!Happy.JP』です。どのように作成したのかを簡単にご紹介いたします。

1.MODXのインストール

2.Amazonアソシエイトのアカウント作成

3.インスタントストアの作成

  • Amazon アソシエイト (アフィリエイト)に上記で作成したアカウントでログインして、インスタントストアを作成しました。
    1. ページ上部の「インスタントストア」タブをクリックし、「インスタントストアのテンプレート」という表示の横にある「このテンプレートを使う」ボタンをクリック。
    2. 「インスタントストアを追加する」画面になり、「インスタントストアのパフォーマンスを計るために使用するトラッキングID を選択してください。トラッキングID はインスタントストアのURL上に表示されます。」と表示されたので、そのまま「次に進む」ボタンをクリック。
    3. 「インスタントストアのページを作成する」画面になったので、「カテゴリーページを追加」からカテゴリーと商品を追加して、「次に進む」ボタンをクリック。
    4. 「カラーとデザインを編集する」画面になったので、テーマを選択/カスタマイズし、ストア名を設定して、「次に進む」ボタンをクリック。
    5. 「サイドバー」画面になったので、サードバーの位置(右/左)とサイドバーに表示する内容を選択して、「この設定でHTMLを取得する」ボタンをクリック。
    6. 「あなたのストアが作成されました」と表示され、インスタントストアのURLが表示されました。
    7. インスタントストアの表示方法として、「iframe形式でインスタントストアをWebサイトに組み込む場合」を選択すると、iframe形式のHTMLが表示されました。
  • MODXに新規に作成したページ(リソース)に、表示されたiframe形式のHTMLをコピーして貼付けました。

4.スニペットの作成

  • MODXには、スニペットというPHPスクリプトをページ(リソース)で実行させる機能があるので、『AmazonセールスランクBest10』を表示する Product Advertising APIの自作プログラムをスニペットにして、新規に作成したページ(リソース)に貼付けました。(スニペットがどんなものかは、MODX公式サイトさんの「簡易チュートリアル」を参照願います。)

皆さんもMODXとAmazon【インスタントストア】、Product Advertising APIを組み合わせて素敵なネットショプを作成してみてはいかがででしょう。