Jump to content

{SOLVED} How To Change The Position of the Logo?

pneeds

By pneeds
in Configuring and using PrestaShop

 Share

Recommended Posts

pneeds Newbie

pneeds

Posted
Posted (edited)

Hiya, hopefully someone can help me. I've been trying for days to change the position of my logo with no success. I've searched the forum and have found dated replies (2010 etc) that doesn't seem to apply to the current css. I've searched within my css and still cannot find what has been recommended to change.

 

I've attached a picture to illustrate what I mean. Someone please help me! :(

post-28219-0-17438500-1347140201_thumb.png

Edited by pneeds (see edit history)
Link to comment
Share on other sites
pneeds Newbie

pneeds

Posted
  • Author
Posted

So I managed to do something that works.

 

> themes > prestashop_new > css > grid_prestashop.css and changed line 48 (.container_9 .grid_6 {width:646px;) to (.container_9 .grid_6 {width:400px;})

 

It might not be the 'correct' way but it works for me.

  • Like 1
Link to comment
Share on other sites
  • 1 year later...
gerstavros Newbie

gerstavros

Posted
Posted

So I managed to do something that works.

 

> themes > prestashop_new > css > grid_prestashop.css and changed line 48 (.container_9 .grid_6 {width:646px;) to (.container_9 .grid_6 {width:400px;})

 

It might not be the 'correct' way but it works for me.

In global.css:

 

HEADER

************************************************************************************************ */

#header {position:relative}

#header_logo {

position: absolute;

left:0;

top: 30px;

z-index: 1;

}

 

#header_right {

position:relative;

float: right

}

  • Like 1
Link to comment
Share on other sites
gerstavros Newbie

gerstavros

Posted
Posted

a bit old thread (from 2012)

solution above is for ps 1.5 ?

Yes, and for default template.

I just searched how to do it, found this thread, checked the global.css file which El Patron mentioned, found the code and posted it for other people who may search it 

  • Like 1
Link to comment
Share on other sites
  • 3 weeks later...
kimy Newbie

kimy

Posted
Posted (edited)

/* ************************************************************************************************
        HEADER
************************************************************************************************ */
#header {position:relative}
#header_logo {
    position: absolute;
    left:0;
    top: 20px;
    z-index: 1;
}

 

in global css on line 549 and 550 change value for left and top. for my store I changed the value of top from 30 to 20.

my logo was inside the top horizontal menu before I changed this value.

 

PrestaShop™ 1.5.6.2

Edited by kimy (see edit history)
Link to comment
Share on other sites
  • 1 month later...
  • 2 months later...
  • 1 year later...
CzechMobile Newbie

CzechMobile

Posted
Posted

Hi i have a problem with setup my logo in center I'm trying to make it with your advice but still nothing happened 

 

Here is my global.css I'm using template Fidelity 2. Please help mee  :(

 

Here is my header.tpl

{*
* 2007-2014 PrestaShop
*
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License (AFL 3.0)
* that is bundled with this package in the file LICENSE.txt.
* It is also available through the world-wide-web at this URL:
* http://opensource.org/licenses/afl-3.0.php
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to [email protected] so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to http://www.prestashop.com for more information.
*
*  @author PrestaShop SA <[email protected]>
*  @copyright  2007-2014 PrestaShop SA
*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
*  International Registered Trademark & Property of PrestaShop SA
*}
<!DOCTYPE HTML>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7 " lang="{$lang_iso}"><![endif]-->
<!--[if IE 7]><html class="no-js lt-ie9 lt-ie8 ie7" lang="{$lang_iso}"><![endif]-->
<!--[if IE 8]><html class="no-js lt-ie9 ie8" lang="{$lang_iso}"><![endif]-->
<!--[if gt IE 8]> <html class="no-js ie9" lang="{$lang_iso}"><![endif]-->
<html lang="{$lang_iso}">
	<head>
		<meta charset="utf-8" />
		<title>{$meta_title|escape:'html':'UTF-8'}</title>
{if isset($meta_description) AND $meta_description}
		<meta name="description" content="{$meta_description|escape:'html':'UTF-8'}" />
{/if}
{if isset($meta_keywords) AND $meta_keywords}
		<meta name="keywords" content="{$meta_keywords|escape:'html':'UTF-8'}" />
{/if}
		<meta name="generator" content="PrestaShop" />
		<meta name="robots" content="{if isset($nobots)}no{/if}index,{if isset($nofollow) && $nofollow}no{/if}follow" />
		<meta name="viewport" content="width=device-width, minimum-scale=0.25, maximum-scale=1.6, initial-scale=1.0" /> 
		<meta name="apple-mobile-web-app-capable" content="yes" /> 
		<link rel="icon" type="image/vnd.microsoft.icon" href="{$favicon_url}?{$img_update_time}" />
		<link rel="shortcut icon" type="image/x-icon" href="{$favicon_url}?{$img_update_time}" />
        <link href='http://fonts.googleapis.com/css?family=Vollkorn:400,700' rel='stylesheet' type='text/css'>
        <link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>

{if isset($css_files)}
	{foreach from=$css_files key=css_uri item=media}
		<link rel="stylesheet" href="{$css_uri|escape:'html':'UTF-8'}" type="text/css" media="{$media|escape:'html':'UTF-8'}" />
	{/foreach}
{/if}
        <link rel="stylesheet" href="{$css_dir|escape:'html':'UTF-8'}/animate.css" type="text/css" media="{$media|escape:'html':'UTF-8'}" />
{if isset($js_defer) && !$js_defer && isset($js_files) && isset($js_def)}
	{$js_def}
	{foreach from=$js_files item=js_uri}
	<script type="text/javascript" src="{$js_uri|escape:'html':'UTF-8'}"></script>
	{/foreach}
    <script src="{$js_dir|escape:'html':'UTF-8'}/waves.js" type="text/javascript"></script>
{/if}
		{$HOOK_HEADER}
		<!--[if IE 8]>
		<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
		<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
		<![endif]-->
	</head>
	<body{if isset($page_name)} id="{$page_name|escape:'html':'UTF-8'}"{/if} class="{if isset($page_name)}{$page_name|escape:'html':'UTF-8'}{/if}{if isset($body_classes) && $body_classes|@count} {implode value=$body_classes separator=' '}{/if}{if $hide_left_column} hide-left-column{/if}{if $hide_right_column} hide-right-column{/if}{if isset($content_only) && $content_only} content_only{/if} lang_{$lang_iso}">
	{if !isset($content_only) || !$content_only}
		{if isset($restricted_country_mode) && $restricted_country_mode}
			<div id="restricted-country">
				<p>{l s='You cannot place a new order from your country.'} <span class="bold">{$geolocation_country|escape:'html':'UTF-8'}</span></p>
			</div>
		{/if}
		<div id="page">
			<div class="header-container">
				<header id="header">
					<div class="banner">
						<div class="container">
							<div class="row">
								{hook h="displayBanner"}
							</div>
						</div>
					</div>
                    <div class="container_header">
                        <div class="nav">
                            <div class="container">
                                <div class="row display_nav_container">
                                    <nav>{hook h="displayNav"}</nav>
                                </div>
                            </div>
                        </div>
                        <div>
                            <div class="container display_top_container">
                                <div class="row">
                                  <div id="header_logo">
                                        <a href="{$base_dir}" title="{$shop_name|escape:'html':'UTF-8'}">
                                            <img class="logo img-responsive" src="{$logo_url}" alt="{$shop_name|escape:'html':'UTF-8'}"{if isset($logo_image_width) && $logo_image_width} width="{$logo_image_width}"{/if}{if isset($logo_image_height) && $logo_image_height} height="{$logo_image_height}"{/if}/>
                                        </a>
                                    </div>
                                    {if isset($HOOK_TOP)}{$HOOK_TOP}{/if}
                                </div>
                            </div>
                        </div>
                    </div>
				</header>
			</div>
            <div class="homeslider">
                {hook h="displayTopSlider"}
            </div>
			<div class="columns-container">
				<div id="columns" class="container">
					{if $page_name !='index' && $page_name !='pagenotfound'}
						{include file="$tpl_dir./breadcrumb.tpl"}
					{/if}
					<div id="slider_row" class="row">
						<div id="top_column" class="center_column col-xs-12 col-sm-12">{hook h="displayTopColumn"}</div>
					</div>
					<div class="row">
						{if isset($left_column_size) && !empty($left_column_size)}
						<div id="left_column" class="column col-xs-12 col-sm-{$left_column_size|intval}">{$HOOK_LEFT_COLUMN}</div>
						{/if}
						{if isset($left_column_size) && isset($right_column_size)}{assign var='cols' value=(12 - $left_column_size - $right_column_size)}{else}{assign var='cols' value=12}{/if}
						<div id="center_column" class="center_column col-xs-12 col-sm-{$cols|intval}">
	{/if}

global.csspost-1014958-0-36303800-1439813217_thumb.png

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing
×
×
  • Create New...