Custom theme not displaying dashboard & tool bars in html c5 theme

Permalink
I've followed the steps- here ("Converting an HTML Template to a Concrete5 Theme") for a super simple custom bootstrap based theme, "mytheme". The above process actually is pretty simple, thanks for the great tutorial. But for some reasons I've had some issues getting things to work. Currently the I have no c5 tool bars displaying, it should be good. Pretty sure it's the theme bootstrap conflicting with the c5 bs? Like discussed in the "Assets Screencast". When I take out the bootstrap stylesheet the toolbars are displayed correctly but of coarse the bootstrap css is not applied and the lay out is broken.

here is my site:http://torquecreativellc.com/

Any Help is greatly, greatly appreciated.

mikeyB
 
Gondwana replied on at Permalink Best Answer Reply
Gondwana
Check you've used getPageWrapperClass(); check CSS z-index values; check you're loading the required JS files (especially jquery) exactly once.
mikeyB replied on at Permalink Reply 2 Attachments
mikeyB
Thanks for the reply. none of those seem to be the issue, but apparently i don't know jack. this issue shouldn't be this hard to figure out. no z-index in my css, yes I have <?= $c->getPageWrapperClass() ?>. Pretty sure it's my BS conflicting with c5 bs. no idea how to fix.
Steevb replied on at Permalink Reply
Steevb
Probably a js conflict.
Make the site public so we can take a look at the source.
mikeyB replied on at Permalink Reply
mikeyB
yep, sorry I had not public since its broken, it's up now. thx
Steevb replied on at Permalink Reply
Steevb
Concrete5 jquery is missing in header and is replaced with Bootstrap jquery in footer. You might want to look at that.

You're not running a 'package', but a 'theme' in the 'applications' folder?

What does your 'page_theme.php' look like, that can cause issues if not coded properly.

You don't need to call Bootstrap stuff sometimes when it's already called by C5.

Check paths and conflicts.

Try taking out bs jquery in footer and replace c5 jquery in header, so if that helps.

I might be barking up the wrong tree, but it's a start.
mikeyB replied on at Permalink Reply
mikeyB
thanks I'll follow these leads this evening, let you know how it goes. I appreciate the help.
mikeyB replied on at Permalink Reply
mikeyB
Steevb,
Yes, I'm running a 'theme' in the 'applications' folder, because I am following the "Converting an HTML Template to a Concrete5 Theme" screencast in C5 Docs. I'm new to doing this. I know html/css fairly well, js not so much, and suck php. The tut didn't say any thing about 'page_theme.php" so I didn't have one. I fought with the js & bs being loaded, no fix. turns out it was the CSS z-index values in the theme bootstrap css. Thank You Gondwana!

Now the "design & custom temp" block drop downs are broken, just as discussed in C5 docs 'Assets Screen Cast'. I have since made a 'page_theme.php' with the register assets code but doesn't seem to be working.
<?php
namespace Application\Theme\mytheme;
use Concrete\Core\Page\Theme\Theme;
class PageTheme extends Theme
{
     public function registerAssets()
   {
       $this->providesAsset('javascript', 'bootstrap/*');
       $this->providesAsset('css', 'bootstrap/*');
       $this->providesAsset('css', 'blocks/form');
       $this->providesAsset('css', 'core/frontend/*');
   $this->requireAsset('javascript', 'jquery');
   }
}
?>


The code seem to be correct, but I don't appear to have the folder "core" inside "concrete"? I assumed this was part of c5, do I need to create "core" and contents? Any Ideas?
Steevb replied on at Permalink Reply
Steevb
Try replacing 'Core' with 'Application'.
mikeyB replied on at Permalink Reply
mikeyB
no go.
MrKDilkington replied on at Permalink Reply
MrKDilkington
Hi mikeyB,

If you zip up your theme and attach it as a reply, I can take a look at it.
mikeyB replied on at Permalink Reply 1 Attachment
mikeyB
Thanks MrKDilkington,
I'm really stuck, and of coarse need to get this site up and running. Have followed the c5 Doc's but something is missing, I'm not familiar enough with c5 structure or PHP to figure it out.
I've zipped: applications>theme>mytheme>etc
Thanks again for taking a look!
MrKDilkington replied on at Permalink Reply
MrKDilkington
@mikeyB

The theme that you attached has one page template called "full.php". This page template does not contain any areas and without them you cannot place blocks on a page.

Based on the content hard coded into full.php, it appears that you do not have a complex page layout. Instead of creating your own theme, I recommend customizing an existing theme.

I would start with Cloneamental, the packaged version of the default Elemental theme:
https://www.concrete5.org/marketplace/themes/cloneamental...
mikeyB replied on at Permalink Reply 6 Attachments
mikeyB
MrKDilkington,
Thanks for taking a look. I have attached a zip with "full.php" with some areas with block content in them. mytheme> "full.php" page seems to be working well except for no drop downs on block design tool bar (image-1).

Yes, the hard code is simple, the layout and html content are basically place holder stuff to work with. Part of my goal was to learn process to convert html to c5 so I can do it with more elaborate layouts in the future. I have also found it frustrating to customized purchased c5 themes that I've worked with in the past.

The other part of this goals is that I am condensing a few of my sits into one C5 site. I will be representing 3 different brands so the interior pages will be styled quite differently (similar to images 2-4) but with the same basic nav, layout, structure. My home page will match the look and feel of an external site housing galleries & shopping carts (image-5). Do you think the packaged Cloneamental theme will still be easier to customize for these different interior pages?

Would the best strategy be to add external style sheets, or create a bunch of custom classes.?

Also made site pubic, again.
MrKDilkington replied on at Permalink Reply
MrKDilkington
@mikeyB

The reason I mention Cloneamental/Elemental is because it provides a good example of how a theme can be structured. Customizing it will be good practice, especially if you offer web design services and intend to offer concrete5 development.

Regarding the different visual brands within the site, you could find the CSS that all three brands share and use that as your common CSS. From there there are multiple options on how you could organize the CSS.

One approach would be using Less to create a main.less file that stores the common CSS shared between the three brands. Each brand would be namespaced and have its own .less file that is imported into main.less.
mikeyB replied on at Permalink Reply
mikeyB
Ok, thanks for the feedback and help. I give it a try with cloneamental and see what I can do. maybe come back the theme building idea once I have a better under standing of c5 structure and operating. Thanks Steevb & MrKDilkington.
Steevb replied on at Permalink Reply 2 Attachments
Steevb
Works for me with 5.7.5.12 and 8.1, see attached.
Only thing I did was make nav relative when logged in, so it's not hidden:
<?php $u = new User();
 if ($u->isLoggedIn()) { ?>
    <style>
 .navbar-fixed-top,
.navbar-fixed-bottom {
   position: relative !important
   }
    </style>
<?php } ?>
mikeyB replied on at Permalink Reply
mikeyB
Steevb,

Would this code go in 'full.php' ?
Steevb replied on at Permalink Reply
Steevb
Inside head:
<!DOCTYPE html>
<html lang="en">
<head>
   <?php Loader::element('header_required') ?>
<!-- Bootstrap -->
   <link href="<?= $view->getThemePath() ?>/css/bootstrap.css" rel="stylesheet" type="text/css">
   <link href="https://fonts.googleapis.com/css?family=Open+Sans:300|Oswald" rel="stylesheet">
   <link href="<?= $view->getThemePath() ?>/css/custom.css" rel="stylesheet" type="text/css">
<?php $u = new User();
 if ($u->isLoggedIn()) { ?>
    <style>
   .navbar-fixed-top,
.navbar-fixed-bottom {
   position: relative !important
   }
Gondwana replied on at Permalink Reply
Gondwana
(Redacted.)