Responsive admin theme for FlatPress

This is a new responsive theme for the Flatpress control panel.

This is a Beta version of the theme, so dont use in professional/personal blogs.

Download

Download Link: https://github.com/franciscoarocas/flatpress-responsive-admin-theme

Installation

To install, just uncompress the new admin theme in your flatpress installation. Then, go to the admin panel, select “Maintain”, and “Purge theme and templates cache”.

Uninstall

To uninstall the admin theme, delete the “admin” folder, and upload the default “admin” folder of your flatpress version (Go to flatpress homepage, and download it).

Also, you need to reemplace this files:

  • login.php
  • fp-interface/sharedtpls/login.tpl
  • fp-interface/sharedtpls/login_page.tpl
  • fp-interface/sharedtpls/login_success.tpl

If you use one of this plugins, you need also reemplace their tpl files (Copy tpl files from each plugin).

  • BBcode
  • Blockparser
  • Lastcommentsadmin
  • qspam
  • Mediamanager

For developers

Languagues packs

If you want to create a new languague pack, you need to add some words if you want to use the admin theme.

When you download the admin theme, you can see this new words added into the languague folder. A list of the new words:

  • lang.admin.php
    • help_top
    • logout_top
    • close
    • footer
  • lang.admin.entry.php
    • add_new_entry
    • your_drafts
    • cats_info
  • lang.admin.main.php
    • quick_menu
    • welcome_back
    • can_do
    • last_comments
    • add_new_entry
    • entry_name
    • entry_content
    • publish
    • saveandcontinue
    • preview
    • help
    • useful_links
    • fp_home
    • fp_blog
    • fp_forums
    • fp_wiki
  • lang.admin.maintain.php
    • help
    • useful_links
    • fp_home
    • fp_blog
    • fp_forums
    • fp_wiki
    • no_news
  • lang.admin.uploader.php
    • choose_file

Admin plugins

If you want to create an admin plugin, you need to know:

First, this theme is based in boostrap. However, it doesnt have all the css classes of boostrap framework and it doesnt include boostrap js files.

This links of official boostrap documentation can be helpful: Grid system, Cards.

This is an example of admin panel, with 2 rows and 4 columns. If you want to create a row, just use the class “row”, and then create “cols” inside this row. Also, you can create this columns with different sizes. For example, a row with a large and small column:

<div class="row">

    <div class="col-lg">Hello World!</div>

    <div class="col-sm">Hello World!</div>

</div>

To create more rows, only:

<div class="row></div>

<div class="row"></div>

This is a card. It has and a title and a content. The title is the card-head, and the content the card-body.

<div class="card">

     <div class="card-head"><h6 class="m-0 font-weight-bold text-primary">Title</div>

     <div class="card-body">Content</div>

</div>

By last, if you want to use inputs, textares, selects, etc. Use this class: “form-control”. Also, if you want to use the gray background, add the class: “.input_gray”

For buttons, use “btn” class and “btn-primary, btn-secondary…”. It change the button color, see: buttons. By default, use: “btn btn-primary”, when you want to use buttons.

Inputs are not limited in size by default. If you want to limite the size, create a new class, and add “max-width”, with a width in pixels, for example: “max-width:300px;”

Changelog


Version Beta 0.1

  • I added the first version of admin in a Beta version.

Bugs

  • Problems with Ckeditor and BBCode (Ckeditor doesnt show BBCode)
  • Cards “Add new entry” and “Last 3 comments” in main menu dont work

Contact


If you want to contact to me, you can send me a message in the contact page, or you can publish a comment in some entry of my blog.

www.000webhost.com