Forums

CSS Not Working?

Permalink
Hey eveyone, I'm super-new to Concrete 5 and wanted to see if I could install and use a custom theme. I thought I did all the steps correctly, but it seems like the css files aren't rendering correctly.

I'm trying to use the Prologue theme fromhttp://html5up.net/ that I've customized (you can see the non-C5 site here:http://suwanneebike.org/pro/)

Here's the C5 site:http://suwanneebike.org/c5/

If you view source it looks like all the references are ok, I can even pull up the css...it just isn't displaying correctly? Hope it's an easy fix and not "that template isn't compatible" kind of an issue. Thanks experts!
jodibean28
 
keeasti replied on at Permalink Reply
keeasti
The css files don't seem to be where they are supposed to be
Do you have FTP access to the site?
jodibean28 replied on at Permalink Reply
jodibean28
I do have FTP access...they show up for me...

http://suwanneebike.org/c5/themes/pro/css/style.css...

Are they not referenced correctly?
mhawke replied on at Permalink Reply
mhawke
My browser shows the css files being called from a css folder off the root rather than your theme folder.

http://suwanneebike.org/c5/css/style.css


Your js is being called from your theme folder so make sure you do the same with the css files.

Quick question... have you split the Prologue HTML up so you have separate header.php and footer.php files in your '[root]/themes/pro/elements/' folder?
mhawke replied on at Permalink Best Answer Reply
mhawke
Just to follow up on my last post... It seems the Prologue theme has some quirks that make it tough to use as a concrete5 theme. Not impossible but tougher. Mainly because it uses a few 'position:fixed' on the 'panel' divs which seem to be fighting with the c5 toolbar placement.

Also, for some reason, they wrapped all the css calls inside < noscript > tags instead of just the first one so I had to adjust this to get the css to get called with:
<noscript>
<link rel="stylesheet" href="<?php echo $this->getThemePath();?>/css/skel-noscript.css" />
</noscript>
<link rel="stylesheet" href="<?php echo $this->getThemePath();?>/css/style.css" />
<link rel="stylesheet" href="<?php echo $this->getThemePath();?>/css/style-wide.css" />
jodibean28 replied on at Permalink Reply
jodibean28
Thank You mhawke!! That was the problem. Fixed the noscript tag and it seems to be working beautifully. I haven't set up the header/footer or any of the editable areas yet...baby steps. :)

Thanks again!
jodibean28 replied on at Permalink Reply
jodibean28
So I got the css to work, but this template still isn't playing nice with C5 as you mentioned earlier. I tried a different template (dopetrope) from the same site and it isn't working either - no admin toolbar after logging in. I'm getting some weird jscript errors...

Should I give up hope and try to find a C5 compatible template that I know will work? The reason we selected these templates was the client (aka hubby) really liked the way the menus slid over on the mobile version of the site. Also they were free. :)
mhawke replied on at Permalink Reply
mhawke
I have tried to convert the Halcyonic theme from the same developer and eventually got it working but there are lots of issues because he is not developing his themes to be used in concrete5. As you can see, they are really not 'free' because they take many hours of frustrating work to get them working and they will never look as good as a 'real' concrete5 theme from a seasoned concrete5 developer.

You have learned a lot about concrete5 from trying to convert this theme but I would suggest you have a look at the 'Fictional' theme that is based on work by HTML5up. It costs $35 but you will be up and running in no time and you can always inspect the theme's code and learn concrete5 even faster because you will have an example of how to do it correctly.

http://www.concrete5.org/marketplace/themes/theme-fictional/...