Problem with core Theme Elemental in Concrete5.7.1

Permalink
Hello i have the problem with the navbar in the theme: elemental (Core theme)

Please watch the Attachment. I Want the Navigation in one line without sublinks.

Please help me

greets

1 Attachment

ebooki
View Replies:
MrKDilkington replied on at Permalink Reply
MrKDilkington
hi wmdesign,

Someone else had a similar question recently.
http://www.concrete5.org/community/forums/5-7-discussion/block-cell...

The width of your sitewide global areas are controlled by the Boostrap grid.

It looks like your logo isn't very wide, so you could remove one or possibly two grid units from it and give them to your navigation.

Before modifying the theme, make sure to back up any files you change.

To change the grid units, you need to open header.php in your Elemental theme.
concrete\themes\elemental\elements\header.php

This is the area you will change:
default unmodified
<header>
    <div class="container">
        <div class="row">
            <div class="col-sm-4 col-xs-6">
                <?php
                $a = new GlobalArea('Header Site Title');
                $a->display();
                ?>
            </div>
            <div class="<?php if ($displayThirdColumn) { ?>col-sm-5 col-xs-6<?php } else { ?>col-md-8 col-xs-6<?php } ?>">
                <?php
                $a = new GlobalArea('Header Navigation');
                $a->display();
                ?>
            </div>


1. try taking one grid unit from the "Header Site Title"
col-sm-4
<div class="col-sm-4 col-xs-6">
change to:
col-sm-3
<div class="col-sm-3 col-xs-6">

2. give that grid unit to "Header Navigation"
col-sm-5
<div class="<?php if ($displayThirdColumn) { ?>col-sm-5 col-xs-6<?php } else { ?>col-md-8 col-xs-6<?php } ?>">
change to:
col-sm-6
<div class="<?php if ($displayThirdColumn) { ?>col-sm-6 col-xs-6<?php } else { ?>col-md-8 col-xs-6<?php } ?>">

<header>
    <div class="container">
        <div class="row">
            <div class="col-sm-4 col-xs-6">   <!-- col-sm-4 to col-sm-3 -->  
                <?php
                $a = new GlobalArea('Header Site Title');
                $a->display();
                ?>
            </div>
            <div class="<?php if ($displayThirdColumn) { ?>col-sm-5 col-xs-6<?php } else { ?>col-md-8 col-xs-6<?php } ?>"> <!-- col-sm-5 to col-sm-6 -->
                <?php
                $a = new GlobalArea('Header Navigation');
                $a->display();
                ?>
            </div>

If taking one grid unit doesn't give you enough space, try taking two grid units to give to "Header Navigation".

To truly understand what is going on, I recommend going to the Bootstrap site and reading about how the grid works.
http://getbootstrap.com/css/#grid...
ebooki replied on at Permalink Reply
ebooki
Hello,

thanks for reply. I will test it now. Then i will write here again. And so sorry for my terrible English..
Greetings from Germany (North-Coast).
ebooki replied on at Permalink Reply 1 Attachment
ebooki
Sorry.. i do it but i dont see any effect. See the picture. What can i do now? i think the new concrete is great, but out of the box theme is difficult to work on it?? (At the header and footer)
ebooki replied on at Permalink Reply 1 Attachment
ebooki
it works!!

i must change the Theme in:
/html/con57/updates/concrete5.7.1/concrete/themes/elemental/elements

:-)
Thx for your help!!

so i can finish the new site in a few days^^
mhawke replied on at Permalink Reply
mhawke
I wish I could share your optimism. Unfortunately, all your changes will be ignored when you upgrade your site to version 5.7.2 (recommended)

Here's what I would suggest you do to make your changes 'update-proof'

1) Copy your whole 'updates/concrete5.7.1/concrete/themes/elemental' folder into 'application/themes/elementalcustom'

2) Open the 'application/themes/elementalcustom/description.txt' file and change the first line to 'Elementalcustom'. I also changed the second line to indicate that this was a copy of the core Elemental theme.

3) Open the 'application/themes/elementalcustom/css/main.less' and change line 6 to be:

@import "../../../../concrete/css/build/core/include/mixins.less";


4) Open the 'application/themes/elementalcustom/page_theme.php' file and change the first line to "namespace Application\Theme\Elementalcustom;"

5) Visit 'Dashboard->Pages and Themes' and install/activate your new Elementalcustom theme.

Make all future changes to your theme files in the application/themes/elementalcustom folder
ebooki replied on at Permalink Reply 1 Attachment
ebooki
Hello,

it dont work here.

i do it step to step and then after install i get a:

File `../../../../../css/build/core/include/mixins.less` not found. in main.less

i dont find why?
mhawke replied on at Permalink Reply
mhawke
Sorry, you have to add 'concrete' to that path so line 6 of

application/themes/elementalcustom/css/main.less

@import "../../../../concrete/css/build/core/include/mixins.less";


I have edited this in my step-by-step post above.
ebooki replied on at Permalink Reply
ebooki
Hello,

at my (server/webhosting) it dont work.. now i want to install the theme, the side become a 404 at install..

so i cant install this theme^ mhh what do i wrong?
jamesleech replied on at Permalink Reply
jamesleech
You could also delete the search block ...

Good to see some discussion around this core theme. Not a good look for people new to C5 to start with something that is kinda not right out of the box.

I'm sure the C5 team is frantic with other stuff but hopefully these niggling aspects can be ironed out for future default installs.
MrKDilkington replied on at Permalink Reply
MrKDilkington
The theme works as expected. Areas aren't resizable in Edit Mode - they are controlled by the underlying CSS.

With the requirement of websites to be responsive these days, there comes a point where CSS has to be edited. You can only do so much with a basic theme before you have to customize it.
marcomeswara replied on at Permalink Reply
Agreed. Where is the underlying css for the basic elemental theme?
Are they here ?

/concrete/themes/elemental/css

Bunch of less files ?

Is this the file for the lemental theme -> /concrete/themes/elemental/css/presets
jincmd replied on at Permalink Reply
jincmd
Perhaps you could try and help me here....On the Elemental theme, I would like to replace my sitewide search box with a company contact number. I've moronically replced the generic "sitewide header search" code with

$a = new GlobalArea('Head Conact');
$a->display();
?>

This has no style, so my litttle search area is gone.... simply put, I just want to replace the clean search bar, with a clean font displaying a business number. THanks for the read and help if presented or not
mhawke replied on at Permalink Reply
mhawke
So why not just add a Content block to the area where the search block used to be and put your business number in there?