New admin theme [Beta][Responsive][Boostrap]

This is the right place to report general bugs, make suggestions or ask for help.
User avatar
franah
Posts: 39
Joined: Wed Aug 14, 2019 11:50 pm
Location: Spain
Contact:

New admin theme [Beta][Responsive][Boostrap]

Post by franah » Sun Sep 15, 2019 9:44 pm

I have been developing a new theme for the current administration panel these months.

So, this is the result:
Screenshot_2019-09-15 Null Pointer Blog « Administration area « Main.png
Screenshot_2019-09-15 Null Pointer Blog « Administration area « Main.png (108.41 KiB) Viewed 18932 times
Important

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

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
Download

Download from GitHub: https://github.com/flatpressblog/flatpr ... nsiveadmin

See more

To see more about this theme (How to create plugins, changelog, etc), visit this link.


Edited by Arvid, 2020-09-06: Link to GitHub repo changed

User avatar
Arvid
FlatPress Coder
Posts: 558
Joined: Sat Jan 26, 2019 7:40 pm
Contact:

Re: New admin theme [Beta][Responsive][Boostrap]

Post by Arvid » Thu Sep 26, 2019 6:49 pm

This is pretty impressive :shock:

I've played around with it a little bit, here are my findings so far:
  • Content is now stored as HTML. (How) Can we keep compatibility with older (BBCode) content? (Maybe there is a way to configure if you'd like a WYSIWYG or a pure BBCode editor? That would satisfy new users (WYSIWYG) and more experienced ones (pureness of BBCode).)
  • The editor has no select box for custom or plugin BBCode tags (e.g., Protected Mail Links)
  • The editor has no select box for uploaded files and images, you need to know the exact path (fp-content/images/snafu.jpg). This fixed path fails with PrettyURLs enabled.
  • JS is loaded from other sites - my personal preference is to stay independent from external services. Shouldn't be too big change to ship the JS libraries?
  • Memo to myself: New ACP text phrases need translations.
  • A link to the frontend home page in the ACP would be nice (upper right corner?).
  • All Plugins affecting the ACP need to be tested and/or updated (e.g. DateChanger).
  • The entries' view counter doesn't seem to work…? (Not sure how the new ACP could affect this)
This list may not be complete - just what I found at first sight. All the other (already implemented) functions seem to work smooth and without problems. Overall, the new ACP looks very clean and fresh (and not to forget: responsive! Still need to test it on mobile gizmos, though). This might be a next big step on our journey to revive FlatPress. I really like what's going on here - great work, franah! :)

(And, after fiddeling around some time: The red isn't that bad. Feels good to work with, even though I'm more the blueish guy^^)

User avatar
franah
Posts: 39
Joined: Wed Aug 14, 2019 11:50 pm
Location: Spain
Contact:

Re: New admin theme [Beta][Responsive][Boostrap]

Post by franah » Mon Sep 30, 2019 9:59 pm

Hi Arvid,

Most of the problems you comment are with the editor, and it may be one of my biggest problems while I was doing the design. About your comment:

About the compatibility of BBCode and HTML I have some ideas:

The first is as you say, to alternate between BBCode and HTML. We can make an option in the administration panel. Or even, when writing the entry, the user can choose to do it in HTML or BBCode.

Another idea that occurred to me is to create a BBCode to HTML converter.

On the option of using your own BBCode or plug-ins in BBCode, you can add plugins to the CKEditor editor, so we would have to create those plugins. We would also have to make another plugin to upload files, and adjust it to FlatPress directories.

I didn't know anything about the mistake with PrettyURLs, that's a big problem.

On the JS, it can be loaded locally. However, the editor is quite heavy, and could increase the size of FlatPress (Several times its current weight).

I also load the JS externally on the Widgets page, but it is the Jquery and the JqueryUI, and is verified using SHA-256. (¿No problem with this?)
I believe that the best option will be to change the editor for another, or develop our own (I prefer the first option, the second will be more work).

About the link in the frontend, if you click on the title of your blog in the upper left, it will take you to the frontend, although we could also add another link in the upper right corner.

About the entries counter, I have not seen any problem, with the FlatPress that I have been using for testing with the new admin.

About colors, we can also add an option to change the administration panel colors (Including of course blue: D).

I will send you a PM with more information.

User avatar
Arvid
FlatPress Coder
Posts: 558
Joined: Sat Jan 26, 2019 7:40 pm
Contact:

Re: New admin theme [Beta][Responsive][Boostrap]

Post by Arvid » Sun Oct 06, 2019 11:18 am

franah wrote: Mon Sep 30, 2019 9:59 pmI also load the JS externally on the Widgets page, but it is the Jquery and the JqueryUI, and is verified using SHA-256. (¿No problem with this?)
Knowing the disadvantages (JS libs may be outdated after time and have to be replaced), I still prefer to be independent. My website should work even if major CDNs are down (which happened!).

franah wrote: Mon Sep 30, 2019 9:59 pmI believe that the best option will be to change the editor for another, or develop our own (I prefer the first option, the second will be more work).
As a little teaser for the readers here: franah may have found a great editor which seems to fit our needs quite well. I'm sure he will tell here if everything works as expected :)

franah wrote: Mon Sep 30, 2019 9:59 pmAbout the link in the frontend, if you click on the title of your blog in the upper left, it will take you to the frontend, although we could also add another link in the upper right corner.
Shame on me, didn't see it :) (Maybe add a little house symbol and/ore a "home" tooltip?)

franah wrote: Mon Sep 30, 2019 9:59 pmAbout the entries counter, I have not seen any problem, with the FlatPress that I have been using for testing with the new admin.
Hm, maybe an issue with my FP theme, I'll have to check that.

franah wrote: Mon Sep 30, 2019 9:59 pmAbout colors, we can also add an option to change the administration panel colors (Including of course blue: D).
I already see the people scream for the craziest color schemes :lol:

User avatar
franah
Posts: 39
Joined: Wed Aug 14, 2019 11:50 pm
Location: Spain
Contact:

Re: New admin theme [Beta][Responsive][Boostrap]

Post by franah » Sat Oct 12, 2019 9:24 pm

Arvid wrote: Sun Oct 06, 2019 11:18 am Knowing the disadvantages (JS libs may be outdated after time and have to be replaced), I still prefer to be independent. My website should work even if major CDNs are down (which happened!).
Ok, not problem with this, however, doing that can increase the size of flatpress considerably, I will try to make it as light as possible.

About Jquery, I see that it is included in Flatpress as a plugin. Is it not preferable to include it as "core" in the Flatpress? That would save many problems.

In addition, the version included in the JQuerry plugin is 1.10.2, which is very old. It would have to be updated.
Arvid wrote: Sun Oct 06, 2019 11:18 am Shame on me, didn't see it :) (Maybe add a little house symbol and/ore a "home" tooltip?)
Ok, I will put an icon of a house, no problem, I will also add some different colors (I will put it later).
Arvid wrote: Sun Oct 06, 2019 11:18 am As a little teaser for the readers here: franah may have found a great editor which seems to fit our needs quite well. I'm sure he will tell here if everything works as expected
About the new editor, there is no problem in changing and putting an option to toggle between html and bbcode.

I will be publishing new versions of the design in the forum :)

User avatar
Arvid
FlatPress Coder
Posts: 558
Joined: Sat Jan 26, 2019 7:40 pm
Contact:

Re: New admin theme [Beta][Responsive][Boostrap]

Post by Arvid » Sun Oct 27, 2019 11:14 am

franah wrote: Sat Oct 12, 2019 9:24 pm About Jquery, I see that it is included in Flatpress as a plugin. Is it not preferable to include it as "core" in the Flatpress? That would save many problems.

In addition, the version included in the JQuerry plugin is 1.10.2, which is very old. It would have to be updated.
Seems sensible to me, I have to look into it. I've opend Issue 53 for this.

franah wrote: Sat Oct 12, 2019 9:24 pmAbout the new editor, there is no problem in changing and putting an option to toggle between html and bbcode.
Is there any need for HTML at all if the editor is able to display BBcode as wysiwyg? I'd rather toggle between "pure BBcode" and "BBcode wysiwyg".

franah wrote: Sat Oct 12, 2019 9:24 pm I will be publishing new versions of the design in the forum :)
Still very excited about that :)

User avatar
franah
Posts: 39
Joined: Wed Aug 14, 2019 11:50 pm
Location: Spain
Contact:

Re: New admin theme [Beta][Responsive][Boostrap]

Post by franah » Thu Nov 07, 2019 11:11 pm

Sorry. I've been very busy these weeks.
Seems sensible to me, I have to look into it. I've opend Issue 53 for this.
For the next version of the admin panel, I will put the Jquery as core. I was thinking of doing the same for bootstrap, but finally, I will only do it with jquery
Is there any need for HTML at all if the editor is able to display BBcode as wysiwyg? I'd rather toggle between "pure BBcode" and "BBcode wysiwyg".
HTML is more complete than BBCode. I personally prefer to include both HTML and BBCode. On the pure BBCode and the BBCode wysiwyg, I prefer BBCode wysiwyg, although we can include the three options. The user can choose between HTML, BBCode pure and BBCode wysiwyg.

User avatar
franah
Posts: 39
Joined: Wed Aug 14, 2019 11:50 pm
Location: Spain
Contact:

Re: New admin theme [Beta][Responsive][Boostrap]

Post by franah » Tue Dec 24, 2019 5:55 pm

Hi, I have done a big redesign.
Which one do you prefer, this new design or the old design?
I prefer this new one.

P.D .: Arvid, sceditor works perfect. No problems

Merry Christmas!
Captura3.PNG
Captura3.PNG (212.5 KiB) Viewed 18015 times
Captura2.PNG
Captura2.PNG (216.06 KiB) Viewed 18015 times

User avatar
franah
Posts: 39
Joined: Wed Aug 14, 2019 11:50 pm
Location: Spain
Contact:

Re: New admin theme [Beta][Responsive][Boostrap]

Post by franah » Wed Dec 25, 2019 11:01 pm

Hi, new version is available (Beta 2). I redesigned the admin panel, fixed some bugs and added Sceditor.
All css and js is included (No CDN). Added an icon to homepage (Right corner).
Also, you can choose between HTML and BBCode in Sceditor. You can change the format in options panel. By default is BBCode.
Now, we need to create a Sceditor pluging to add images and files directly from flatpress uploader, and fix "3 Last comments" and "add new entry" (Main Panel). And the panel will be ready.
Please, try it I need feedback :)

Responsive Screenshot:
Captura645.PNG
Captura645.PNG (50.57 KiB) Viewed 17996 times
Captur23a.PNG
Captur23a.PNG (105.53 KiB) Viewed 17996 times
Captu656ra.PNG
Captu656ra.PNG (38.89 KiB) Viewed 17996 times
DOWNLOAD: https://github.com/franciscoarocas/flat ... es/tag/0.2

User avatar
dajare
Posts: 14
Joined: Wed Dec 25, 2019 2:57 pm
Location: Edinburgh, U.K.

Re: New admin theme [Beta][Responsive][Boostrap]

Post by dajare » Fri Dec 27, 2019 7:42 pm

franah wrote: Wed Dec 25, 2019 11:01 pm Hi, new version is available (Beta 2). I redesigned the admin panel, fixed some bugs and added Sceditor.
. . .
Please, try it I need feedback :)
So I tried this in a fresh test install of FP 1.1, and it worked fine "out of the box"! It looks great! 8-)

Here's a bit of feedback on things I have noticed so far:
  • There are a few typos in the text (and a bit of mixed language! ;) ) that could use some tidying up. That's pretty easy, of course.
  • The Sceditor seems a bit flakey to me: (1) it doesn't seem to like including images unless they are sized (??); (2) editing the menu gives strange results, sometimes giving raw BBcode (!), sometimes not, but I can't seem to convince it to save a *list*.
  • I wonder if it's worth adding a "max-width" rule for the IMG CSS, as on a laptop/desktop monitor scale, getting images zoomed almost to full screen is a bit too much. (For example, in the "Style" preview under "Themes".)
That's not a lot, then, but it's a start. And this is headed in a VERY good direction, so thanks for all the effort you're putting into this!

Post Reply

Who is online

Users browsing this forum: Ahrefs [Bot] and 36 guests