Page 1 of 2

[Extensions] - Admin bar

Posted: Fri Jun 16, 2017 6:34 pm
by bayerberg
Needed a quick way to add posts and pages, thought it would be nice to have those options available all the time (for admins at least) so created this:

Admin Bar v0.9

This should be independent of your theme so if you use it it shouldn't either affect how your page looks and behaves. To be sure of that I've included custom styles. Those styles are loaded only when admin is logged in, that way there is no unnecessary clutter under the hood. One thing though - css uses rem instead of pixels. your theme needs to support rems to display everything correctly.

Yes, its sticky, currently stuck to the bottom of the page.

Yes, it's responsive.

How to use it
  • - Copy the code below
    - Paste it under the <body>
to do
  • - tidy up scss
    - clean up php
    - add more options like edit current page/post

Code: Select all

<?php if($Login->role()=='admin') { ?>
<style>
#admin-strip {
  background: #1e1e20;
  color: #65656d;
  display: block;
  overflow: hidden;
  width: 100%;
  padding: 1rem;
  position: fixed;
  bottom: 0;
  z-index: 999;
}
#admin-strip ul {
  margin: 0.5rem;
  padding: 0;
  overflow: hidden;
}
#admin-strip ul li {
  display: inline-block;
  list-style: none;
  margin: 0;
  padding: 0;
}
#admin-strip .float-me-to-the-right {
  float: right;
}
#admin-strip .you-gotta-spot-this {
  color: #808687;
}
#admin-strip .you-gotta-spot-this strong {
  color: #8e9596;
}
#admin-strip a {
  display: block;
  vertical-align: middle;
}
#admin-strip a:link, #admin-strip a:visited {
  color: #7e7e90;
}
#admin-strip a:hover, #admin-strip a:active {
  color: #ff8c00;
}
#admin-strip .action-buttons {
  font-size: 1.6rem;
}
#admin-strip .admin-new-post, #admin-strip .admin-new-page {
  background: #3d3d42;
  color: #fff !important;
  padding: 0.3rem;
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  margin: 0 0.5rem;
  padding: 0.3rem 1rem;
}
#admin-strip .admin-new-post:hover, #admin-strip .admin-new-page:hover {
  background: #a7c520;
  color: #1e1e20 !important;
  text-decoration: none;
}
#admin-strip .admin-page-logout {
  background: #ff2d00;
  color: #fff !important;
  padding: 0.3rem;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  margin: 0 0.5rem;
  padding: 0.3rem 2rem;
}
#admin-strip .admin-page-logout:hover {
  background: #a7c520;
  color: #1e1e20 !important;
  text-decoration: none;
}
#admin-strip .info-list {
  font-size: 1.3rem;
  line-height: 1.6rem;
}
@media (max-width: 768px) {
  #admin-strip .float-me-to-the-right {
    float: none;
  }
  #admin-strip .info-list {
    display: none;
  }
  #admin-strip .action-buttons {
    font-size: 1.2rem;
    line-height: 1.2rem;
  }
  #admin-strip .action-buttons li {
    display: block;
  }
  #admin-strip .action-buttons li a {
    display: block;
    margin: 0.5rem 0;
    padding: 1rem;
  }
}

</style>
<div id="admin-strip">
  <ul class="action-buttons">
    <li class="you-gotta-spot-this"><?php echo $Site->title() ?> administration:</li>
    <li><a href="<?php echo HTML_PATH_ADMIN_ROOT.'new-post' ?>" class="admin-new-post"><?php $L->p('New post') ?></a></li>
    <li><a href="<?php echo HTML_PATH_ADMIN_ROOT.'new-page' ?>" class="admin-new-page"><?php $L->p('New page') ?></a></li>
    <li><a href="<?php echo HTML_PATH_ADMIN_ROOT ?>" class="admin-panel"> <?php $L->p('Admin panel') ?></a></li>
    <li class="float-me-to-the-right"><a href="<?php echo HTML_PATH_ADMIN_ROOT.'/logout' ?>" class="admin-page-logout"><?php $L->p('Logout') ?></a></li>
  </ul>
  <ul class="info-list">
    <li class="you-gotta-spot-this"><?php $L->p('Logged in as') ?> <strong><?php echo $Login->username() ?></strong> </li>
    <li>Locale <strong><?php echo $Site->locale(); ?></strong></li>
    <li>Timezone <strong><?php echo $Site->timezone();?></strong></li>
    <li>Theme <strong><?php echo $theme = $Site->theme(); ?></strong></li>
    <li>Build <strong><?php echo $Site->currentBuild();?></strong></li>
  </ul>
</div>
<?php } ?>

optional - if you want scss use this in your _app.scss and chuck out <style> from the code above

Code: Select all

#admin-strip {
  background: #1e1e20;
  color: #65656d;
  display: block;
  overflow: hidden;
  width: 100%;
  padding: 1rem;
  position: fixed;
  bottom: 0;
  z-index: 999;
  ul {
    margin: 0.5rem;
    padding: 0;
    overflow: hidden;
    li {
      display: inline-block;
      list-style: none;
      margin: 0;
      padding: 0
    }
  }
  .float-me-to-the-right {
    float: right;
  }
  .you-gotta-spot-this {
    color: #808687;
    strong {
      color: #8e9596;
    }
  }
  a {
    display: block;
    vertical-align: middle;
    &:link, &:visited {
      color: #7e7e90;
    }
    &:hover, &:active {
      color: #ff8c00;
    }
  }
  .action-buttons {
    font-size: 1.6rem;
  }
  .admin-new-post, .admin-new-page {
    background: #3d3d42;
    color: #fff!important;
    padding: 0.3rem;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    margin: 0 0.5rem;
    padding: 0.3rem 1rem;
    &:hover {
      background: #a7c520;
      color: #1e1e20!important;
      text-decoration: none;
    }
  }
  .admin-page-logout {
    background: #ff2d00;
    color: #fff!important;
    padding: 0.3rem;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    margin: 0 0.5rem;
    padding: 0.3rem 2rem;
    &:hover {
      background: #a7c520;
      color: #1e1e20!important;
      text-decoration: none;
    }
  }
  .info-list {
    font-size: 1.3rem;
    line-height: 1.6rem;
  }
  @media (max-width: 768px) {
    .float-me-to-the-right {
      float: none;
    }
    .info-list {
      display: none;
    }
    .action-buttons {
      font-size: 1.2rem;
      line-height: 1.2rem;
      li {
        display: block;
        a {
          display: block;
          margin: 0.5rem 0;
          padding: 1rem;
        }
      }
    }
  }
}

Re: [Extensions] - Admin bar

Posted: Fri Jun 16, 2017 11:26 pm
by Edi
Thank you! I will test it.

Re: [Extensions] - Admin bar

Posted: Wed Sep 13, 2017 6:35 pm
by bayerberg
made it into a plugin! https://github.com/Bayerberg/bludit-admin-bar

Poke me there for updates and tweaks

Re: [Extensions] - Admin bar

Posted: Wed Sep 13, 2017 6:44 pm
by Edi
It's added to the repository. :-)

Thank you!

Re: [Extensions] - Admin bar

Posted: Wed Sep 13, 2017 6:54 pm
by bayerberg
no problemo ;)

need to rename one folder /language instead of /languages... don't commit anything while leaving work :)

Re: [Extensions] - Admin bar

Posted: Thu Sep 14, 2017 3:19 am
by jmonroe
I like the idea and would love to see even more functionality added to the admin bar. I personally would like to see it styled much smaller than currently. The bar is pretty big and takes up a bit of space on the screen. Height and button size maybe can be adjusted a bit. Great work though as it is definitely a great addition to have.

Re: [Extensions] - Admin bar

Posted: Thu Sep 14, 2017 2:56 pm
by bayerberg
yep, I'm working on that. I'll provide couple of options as well - possibility of adding your own styling via the plugin page would be the coolest one especially when i have scss anyone can use to style the bar as they wish.

Re: [Extensions] - Admin bar

Posted: Sun Mar 18, 2018 10:34 am
by Stephan
Got error 'PHP message: PHP Warning: file_get_contents(/var/www/vhosts/.../bl-plugins/bludit-admin-bar-1.0/languages/en.json): failed to open stream: Datei oder Verzeichnis nicht gefunden in /var/www/vhosts/.../bludit-pro/bl-kernel/boot/rules/60.plugins.php on line 80\n', referer: http://.../admin/dashboard

??

Re: [Extensions] - Admin bar

Posted: Sun Mar 18, 2018 11:45 am
by Edi
Where have you downloaded the plugin?

There is an updated version at

https://plugins.bludit.com

Re: [Extensions] - Admin bar

Posted: Sun Mar 18, 2018 12:36 pm
by Stephan
I downloaded it at https://plugins.bludit.com