• 虹色ミツバチ
  • freoカスタマイズメモ、テンプレート・プラグイン配布/officeTIPS
検索プラグイン
虹色ミツバチ

> Entry >freo>freoテンプレート>管理画面用テンプレート> freo管理ページレスポンシブ対応テンプレート

【freo】【freoテンプレート】【管理画面用テンプレート】freo管理ページレスポンシブ対応テンプレート

はじめに

テンプレートについて

このテンプレートは、多機能CMSツールfreo用の非公式テンプレートです。
freoの導入方法はfreo公式サイトをご覧ください。
当サイトは、このテンプレートを使用することによって発生した不利益・損害等には一切責任を負わないものとします。

 

スタイルシートのカスタマイズについて

スタイルシートの内容はご自由に編集して下さい。
スタイルシートの利用・編集について許可を得る必要はありません。

特徴

  • 管理画面をレスポンシブデザインにしています。
  • freoのバージョン1.20.0以降でご利用ください。
  • HTML5に対応。
  • Bootstrap4・fontAwesomeを採用しています。
  • タブレットサイズ(横幅800px以下)、スマートフォンサイズ(横幅480px以下)で閲覧するとそれぞれのデバイス用デザインになります。
  • メニューをアコーディオン(折りたたみ)状に表示します。
  • スマートフォン時はドロワーメニューにしています。
  • スマートフォン時の場合はtinymce利用部分を普通のテキストボックスに変更しています。
  • スマートフォン時はテーブル(表)を(折りたたみ)で表示します。

サンプル

管理ページTOP(PC用)
admin_2_default.jpg
管理ページTOP(スマホ用)
admin_2_default_320.jpg
管理ページエントリー登録画面(PC用)
admin_2_entry_form.jpg
管理ページエントリー登録画面(スマホ用)
admin_2_entry_form_320.jpg

※画像サンプルです。

ダウンロード

32877_admin_responsive_1_2_0.zip

導入方法

  1. 公式からfreoをダウンロードし、設置してください。
  2. ご自分のfreoにアクセスし、正常に動いているかどうか確認してください。
  3. 当サイトで配布しているZIPファイルをDLし、解凍してください。
  4. [freo]フォルダをご自分のfreo設置フォルダにアスキーモードでアップロードしてください。
  5. ブラウザを起動して、スタイルシートが反映されたか確認します。
    更新されない場合は公式のトラブルシューティング「テンプレートを編集しても反映されない」を参照してください。

スマホ用テンプレートをandroidで利用した際記事本文入力時に改行や段落を省略入力する方法を実装する

android端末で本文入力に改行や段落を適用したい場合は、下記TIPSを実装する必要があります。

32877:スマホ用テンプレートをandroidで利用した際記事本文入力時に改行や段落を省略入力する方法を実装する

更新履歴

2013.03.26
配布開始。
2017.09.27
freo(ver.1.20.0以降)に対応。
2018.05.13
ドロワーメニューに変更
Bootstrap4・Font Awesomeを採用
スマホ表示時のテーブルレイアウトを変更
クッキー用jqueryをjs.cookie.jsに変更

ページ移動

関連記事

ページ上部へ