Drupal
Bluemix
Drupal7
apiconnect

API Connectの開発者ポータルをカスタマイズしてみよう!

IBMのAPI製品であるAPI connectは開発者ポータルにDrupalを採用しています。なのでDrupalがわかれば簡単にUI、機能のカスタマイズできます。ここではBuemixでオーダーしたAPI connectのUIの変更方法を紹介します。
さて先ずはBluemixでAPI connectをオーダーしてみましょう。今回は無料のLiteプランを選択しました。

スクリーンショット 2017-09-20 10.28.06.png

オーダー後API connectのダッシュボードを見るとSandBoxができているのがわかります。

スクリーンショット 2017-09-20 10.39.59.png

 SandBoxをクリックしてください。
 次に上のメニューから”設定”を。左メニューから”ポータル”をクリックして”IBM開発者ポータル”を選択してください。選択したら右上のディスクのアイコンをクリックして設定を保存してください。

スクリーンショット 2017-09-20 10.44.47.png

 開発者ポータルができるまで少々お待ちください。
スクリーンショット 2017-09-20 10.56.08.png

 数分待って、ポータルURLの右側をクリックして開発者ポータルに行ってください。以下のような画面が払われます。
スクリーンショット 2017-09-20 11.06.54.png

 ポータルが出来ましたというメールも言っているはずです、そのメールの中に上記開発者ポータルへのAdminのログイン方法が書いてあります。
スクリーンショット 2017-09-20 11.11.56.png

 Adminでログインすると以下のようにAdmin用のメニューが一番上に出て来ます。
スクリーンショット 2017-09-20 11.17.12.png

 これらのメニューでサイトのUIを変えたり機能を追加したりすることができます。
 今回はUIを変えてみましょう。DrupalではUIのことをテーマと言います。テーマは世界中の開発者、ベンダーによって開発されておりご自分の好きなデザインを選ぶことができます。もちろんテーマを変えてもウェブのコンテンツは変わらないのでご安心ください。

 テーマーの例
スクリーンショット 2017-09-20 11.24.37.png
 
 DrupalのコミュニティーをまとめているDrupalアソシエーションのサイトにもたくさんのフリーのテーマが置いてあります。 https://www.drupal.org/project/project_theme
 それではテーマを変えてみましょう。
 上記のアソシエーションのサイトからテーマを選んでください。
 今回は下の Professional Themeを選びます。
スクリーンショット 2017-09-20 11.30.59.png

 こちらをクリックして選ぶと詳細が出て来ます。下の方に行くとテーマのダウンロードリンクが出て来ます。右クリックでダウンロード先のURLをクリップボードにコピーしてください。ちなみにtar.gz形式で、また開発者ポータルで使われているDrupalはバージョン7なので7用の方を選んでください。
スクリーンショット 2017-09-20 11.35.07.png

 開発者ポータルからテーマ-> 新しいテーマをインストールを選んでください。
スクリーンショット 2017-09-20 11.28.33.png

 次のURLからインストールするのところにクリップボードにコピーしたURLを入れてインストールをクリックしてください。

スクリーンショット 2017-09-20 11.40.22.png

 "Enable newly added theme"をクリックしてください。
スクリーンショット 2017-09-20 11.41.37.png

 今インストールしたテーマが下の方に出て来ます。”有効にしディフォルトに設定する”をクリックしてください。
スクリーンショット 2017-09-20 11.43.54.png

見た目(UI)が変わりましたね。
スクリーンショット 2017-09-20 11.46.21.png

色々なテーマを試してみてください。