How to add non clickable text to top?

[Pompidompie]

I have a top, where the languages choice is on the left and the home/login/checkout on the right.
I would like to add the text, free shipping, in the middle/center. Non clickable.

How do I do that?

[stevesh]

It would help if we could see the site.

[Pompidompie]

My question is, how to put a non clickable text in there.
If it where a link, I would probably get it done.
I think I would open tpl_header and make a
<div id="shipping">
Link here
</div>
go to the stylesheet and ad #shipping.
Something like that.

But now I want to add just the words Free shipping (in english, and gratis verzending in dutch) and I don't want to make it a link.
How do I add those words if I don't want them to do anything?

[keneso]

Open tpl_header.php
\includes\templates\YOUR_TEMPLATE\common

Find the piece of code for language selection, and the one for the login, add
<div id="shipping">
Link here
</div>
in between them.

[Pompidompie]

I got it done.
I added this to the header file

<div id="shipping">
<?php echo HEADER_SHIP_TEXT;?>
</div>

Then addes HEADER_SHIP_TEXT to the language files.

And added #shipping to the stylesheet.

So far so good, but i made a mess out of the places where everything goes.


#shipping{width:70%;float:center;}
#header-cart{font-size:140%;text-align:left;}
#cur-lan-header{width:25%;float:left;}
#lang_header{float:left;width:40%;margin-top:4px;}
#navMainWrapper {margin:0 auto;color:#171717;float:right;width:70%;}
#navMain ul {margin:0 auto;padding: 5px 0 0.5em 0;list-style-type:none;text-align:left;line-height: 1.5em;float:right;}
#navMain ul li {display:inline;}
#navMain ul li a {margin:0;padding:0em 1.0em;color: #a0a0a0;text-decoration:none;white-space:nowrap;font-size:100%;text-transform:uppercase;}
#navMain ul li a:hover {color: #8db9fb;}
#navMain i{margin-right:10px;color: #8db9fb;font-size:120%;vertical-align:middle;}
#navMain i:hover{color:#fff;}

I would like the language flags on the left, free shipping in the middle and the login/items/checkout on the right.
And also on the mobile phone

[keneso]

Myabe if you post the relevant code of the tpl_header would be more helpful.

[Pompidompie]

tlp_header

<div id="top-wrapper">
<!--bof-navigation display-->
<div class="onerow-fluid <?php echo $fluidisFixed; ?>">
<div id="navMainWrapper">
<div id="navMain">
    <ul class="back">
<?php if ($_SESSION['customer_id']) { ?>
    <li><a href="<?php echo zen_href_link(FILENAME_LOGOFF, '', 'SSL'); ?>"><i class="fa fa-power-off" title="Log Off"></i><?php echo 

HEADER_TITLE_LOGOFF; ?></a></li>
    <li><a href="<?php echo zen_href_link(FILENAME_ACCOUNT, '', 'SSL'); ?>"><i class="fa fa-gear" title="My Account"></i><?php echo 

HEADER_TITLE_MY_ACCOUNT; ?></a></li>
<?php
      } else {
        if (STORE_STATUS == '0') {
?>
    <li class="h-login"><a href="<?php echo zen_href_link(FILENAME_LOGIN, '', 'SSL'); ?>"><i class="fa fa-user" title="Login"></i><?php echo 

HEADER_TITLE_LOGIN; ?></a></li>
<?php } } ?>


    <li><a href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'NONSSL'); ?>"><i class="fa fa-shopping-cart" title="Shopping Cart"></i><?

php echo $_SESSION['cart']->count_contents();?>  - <?php echo $currencies->format($_SESSION['cart']->show_total());?></a></li>
<li><a href="<?php echo zen_href_link(FILENAME_CHECKOUT_SHIPPING, '', 'SSL'); ?>"><i class="fa fa-check-square-o" title="Checkout"></i><?php echo 

HEADER_TITLE_CHECKOUT; ?></a></li>

   <?php if ($_SESSION['cart']->count_contents() != 0) { ?>
<?php }?>

</ul>
</div>
</div>
<!--eof-navigation display-->


<div id="cur-lan-header">
    <?php require(DIR_WS_MODULES . 'sideboxes/languages_header.php'); ?>
</div>

<div id="shipping">
<?php echo HEADER_SHIP_TEXT;?>
</div>

stylesheet:

/*bof header*/
#headerWrapper{margin:0 auto;}
#top-wrapper{width:100%;height:30px;background:#171717;color:#fff;text-align:left;padding-top:10px;padding-bottom:5px;}
#top-wrapper a{color:#fff;}
#top-inner{background:none;}
.top-specials{text-transform:uppercase;border-radius:3px;letter-spacing:1px;line-height:24px;margin-right:20px;padding:0 10px;font-

size:90%;float:left;background:rgba(0, 0, 0, 0.2);}
#top-middle{width:100%;background:#fff;padding-bottom:20px;border-bottom:2px solid #dbdbce;}
#navMainWrapper {margin:0 auto;color:#171717;float:right;width:70%;}
#navMain ul  {margin:0 auto;padding: 5px 0 0.5em 0;list-style-type:none;text-align:left;line-height: 1.5em;float:right;}
#navMain ul li {display:inline;}
#navMain ul li a {margin:0;padding:0em 1.0em;color: #a0a0a0;text-decoration:none;white-space:nowrap;font-size:100%;text-transform:uppercase;}
#navMain ul li a:hover {color: #8db9fb;}
#navMain i{margin-right:10px;color: #8db9fb;font-size:120%;vertical-align:middle;}
#navMain i:hover{color:#fff;}
#navEZPagesTop {background-color:#444;}
#navEZPagesTop {margin:0;padding:0.5em;font-size:0.95em;font-weight:bold;color:#fffffd;}
#navEZPagesTop a{color:#fffffd;}
#navEZPagesTop a:hover {color:#f99d30;}
#navCatTabsWrapper {margin: 0em;background-color: #444;width:100%;height:1%;font-weight: bold;color: #fff;}
#navCatTabs ul  {margin: 0;padding:  0.5em 0em;list-style-type: none;text-align: center;line-height: 1.5em;}
#navCatTabs ul li {display: inline;}
#navCatTabs ul li a {text-decoration: none;padding: 0em 0.5em;margin: 0;color: #fffffd;white-space: nowrap;}
#navBreadCrumb {margin:18px 0 0 0;}
#navMainSearch {margin:0;float:right;margin-top:-40px;}
.search-header-box {padding-left:5px;background:#fff;width:160px;height:28px;color:#a0a0a0;border:1px solid #dbdbce;text-

transform:lowercase;font-size:75%;}
.search-box {padding-left:5px;background:#fff;width:160px;height:28px;color:#a0a0a0;border:1px solid #dbdbce;text-transform:lowercase;font-

size:80%;}
.search-header-box:focus{background:#fff;}
#navMainSearch-mobile{display:none;}
#header-cart{font-size:140%;text-align:left;}
#cur-lan-header{width:25%;float:left;}
#lang_header{float:left;width:40%;margin-top:4px;}
.header-checkout{color:#fff;}
.header-checkout:hover{color:#8cb9fb;}
#shipping{width:70%;float:center;} 

As you can see the stylesheet is a little messed up

[keneso]

Try using this as a starting point, borders are so to point out the "areas", based on the other elements (i-e- top-wrapper, and onerow-fluid) you need to do your adjustements.
Notice I moved the language, and shipping in your tpl_header.

#navMainWrapper {
  background-color: #3c3c3c;
  color: #00ffff;
  float: left;
  font-weight: bold;
  height: 1%;
  margin: 0;
  padding: 0.5em 0.2em;
  width: 100%;
}

#cur-lan-header {
  width: 18%;
  border: 1px solid #f00;
  float: left;
}
#shipping {
  width: 36%;
  border: 1px solid #0f0;
  float: left;
}
#navMain {
  width: 45%;
  border: 1px solid #ff0;
  float: left;
}

<div id="top-wrapper">
<!--bof-navigation display-->
<div class="onerow-fluid <?php echo $fluidisFixed; ?>">
<div id="navMainWrapper">

<div id="cur-lan-header">
    <?php require(DIR_WS_MODULES . 'sideboxes/languages_header.php'); ?>
</div>

<div id="shipping">
<?php echo HEADER_SHIP_TEXT;?>
</div>

<div id="navMain">
    <ul class="back">
<?php if ($_SESSION['customer_id']) { ?>
    <li><a href="<?php echo zen_href_link(FILENAME_LOGOFF, '', 'SSL'); ?>"><i class="fa fa-power-off" title="Log Off"></i><?php echo 

HEADER_TITLE_LOGOFF; ?></a></li>
    <li><a href="<?php echo zen_href_link(FILENAME_ACCOUNT, '', 'SSL'); ?>"><i class="fa fa-gear" title="My Account"></i><?php echo 

HEADER_TITLE_MY_ACCOUNT; ?></a></li>
<?php
      } else {
        if (STORE_STATUS == '0') {
?>
    <li class="h-login"><a href="<?php echo zen_href_link(FILENAME_LOGIN, '', 'SSL'); ?>"><i class="fa fa-user" title="Login"></i><?php echo 

HEADER_TITLE_LOGIN; ?></a></li>
<?php } } ?>


    <li><a href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'NONSSL'); ?>"><i class="fa fa-shopping-cart" title="Shopping Cart"></i><?

php echo $_SESSION['cart']->count_contents();?>  - <?php echo $currencies->format($_SESSION['cart']->show_total());?></a></li>
<li><a href="<?php echo zen_href_link(FILENAME_CHECKOUT_SHIPPING, '', 'SSL'); ?>"><i class="fa fa-check-square-o" title="Checkout"></i><?php echo 

HEADER_TITLE_CHECKOUT; ?></a></li>

   <?php if ($_SESSION['cart']->count_contents() != 0) { ?>
<?php }?>

</ul>
</div>
</div>
<!--eof-navigation display-->

[Pompidompie]

Thank you Keneso, that helped me a lot! By coloring the borders red (#ff0000) I could see what you did.
I can now play with it some more and make it exactly how I want. Again, thank you!