Jump to content

[release] Bootstrap Admin Theme


almonk
 Share

Recommended Posts

I recently made a few custom modules for a client (sadly not able to share) that required quite an 'app like' environment. While Apeisa is busy working on the updates to his clean admin theme that I have designed, I thought I'd put together a different theme entirely.

This theme uses the Twitter Bootstrap framework, which is really nice if you haven't already tried it. There's quite a few nasty hacks that I've had to do to skew PW to fit the framework, but none of it is too apparent to the user.

uhh3uifn43.jpg

You can fork the code here (git clone into a folder called templates-admin under site):

https://github.com/almonk/Bootstrap-admin-theme

It's still a wip, but very much usable already. Please fork and improve.

Thanks,

Al

Link to comment
Share on other sites

I like this theme very much! I also liked your PinWire some time ago :)

Anyway, there seems to be a problem with the name, next to the login. i checked the default.php and found out something wrong in these lines

<?php if($user->hasPermission('profile-edit')): ?> 
   <li><a class='action' href='<?php echo $config->urls->admin; ?>profile/'><?=$user->name?></a></li>
<?php endif; ?>

I couldn't find the error there(maybe because i don't know much of php, or maybe because i'm quite sleepy :)), so i just rewrote it in a different way, and it works now

<?php if($user->hasPermission('profile-edit')):  
   echo "<li><a class='action' href='" . $config->urls->admin . "profile/'>" . $user->name . "</a></li>";
endif; ?>

EDIT: Hm, In my office computer it works fine just as it is on github. I took another look at the code, and there seems to be nothing wrong with it...

anyone knows what might have happened?

post-349-132614279139_thumb.png

Link to comment
Share on other sites

The problem is right here:

<?=$user->name?>

That's a PHP short tag. The majority of PHP installations have them enabled, but not all do. As a result, it's not always safe to use short tags in things like admin themes, modules, or templates/profiles intended for broad distribution.

@almonk: next time you are making updates, this can be fixed just by changing it to:

<?php echo $user->name; ?>
Link to comment
Share on other sites

I recently made a few custom modules for a client (sadly not able to share) that required quite an 'app like' environment. While Apeisa is busy working on the updates to his clean admin theme that I have designed, I thought I'd put together a different theme entirely.

Damn you Alistair :)

This is even better looking theme than the one before (that I am porting to clean admin). And not just the looks, I really like how this one feels to use!

EDIT: I think that pw admin would really benefit from simple dropdown navigation. One click access from anywhere to templates, fields, users, permissions and roles. Setup and access pages are really just container pages without any content or function, so easy way to skip those would mean faster site building and maintaining.

Link to comment
Share on other sites

I think that pw admin would really benefit from simple dropdown navigation. One click access from anywhere to templates, fields, users, permissions and roles. Setup and access pages are really just container pages without any content or function, so easy way to skip those would mean faster site building and maintaining.

Cool idea, Apeisa! Totally agree here. This would make navigation much faster.

Link to comment
Share on other sites

I think that pw admin would really benefit from simple dropdown navigation. One click access from anywhere to templates, fields, users, permissions and roles. Setup and access pages are really just container pages without any content or function, so easy way to skip those would mean faster site building and maintaining.

I agree, that makes sense. I'll work on this.

Link to comment
Share on other sites

Love this theme - only thing I changed so far was to make it fixed-width again. Obviously it's all down to personal preference, but it helps because my site is fixed-width too so if I have the TinyMCE fields around the same width then you get a better representation of how the text (which will be interspersed with images inserted trhough TinyMCE on some pages) will look on the live site.

Also at 1600 pixels wide on my screen, some paragraphs of text just fit the full width and it made reading the content of some of the pages a bit hard for me.

Just personal preferences like I say, and it was a simple CSS edit to change it to fixed-width.

Link to comment
Share on other sites

  • 1 month later...
  • 4 months later...

Hi! This is my first post here ;-)

I solved the issues mentioned by Soma by editing bootstrap.css.

Go to /wire/templates-admin/styles/bootstrap.css

Remove or comment line 2063 to 2087 (.modal class) and replace it by:

body.modal {
  background-position: 0 -60px !important;
}
body.modal div.topbar,
body.modal ul#breadcrumb {
  display: none;
}
body.modal div.container-fluid {
  min-width: 300px;
}
body.modal div.container-fluid > div[style] {
  padding-top: 15px !important;
}

bootstrap-insert-image.png

  • Like 2
Link to comment
Share on other sites

  • 2 weeks later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...