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.
here is my site:http://torquecreativellc.com/
Any Help is greatly, greatly appreciated.
Check you've used getPageWrapperClass(); check CSS z-index values; check you're loading the required JS files (especially jquery) exactly once.
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.
Probably a js conflict.
Make the site public so we can take a look at the source.
Make the site public so we can take a look at the source.
yep, sorry I had not public since its broken, it's up now. thx
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.
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.
thanks I'll follow these leads this evening, let you know how it goes. I appreciate the help.
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.
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?
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?
Try replacing 'Core' with 'Application'.
no go.
Hi mikeyB,
If you zip up your theme and attach it as a reply, I can take a look at it.
If you zip up your theme and attach it as a reply, I can take a look at it.
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!
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!
@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...
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...
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.
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.
@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.
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.
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.
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:
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 } ?>
Steevb,
Would this code go in 'full.php' ?
Would this code go in 'full.php' ?
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 }
Viewing 15 lines of 18 lines. View entire code block.
(Redacted.)