Как сделать логотип в шапке ссылкой

SmokerMan

Гуру
5291
720 / 26

Re: Как сделать логотип в шапке ссылкой

« Ответ #30 : 14.08.2010, 00:58:07 »

Цитата: rkorkin от 13.08.2010, 20:10:35

В этой же шапке с левой стороны расположен логотип, этот участок тоже было бы здорово сделать кликабельным.

а там, случайно, дерева со стороны Юпитера не стояло?

Записан

rkorkin

Осваиваюсь на форуме
31
0 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #31 : 14.08.2010, 12:31:21 »

Только знакомлюсь с жумлой, так что сильно не бейте если что, и направляйте в нужную сторону )))
В шаблоне шапка прописана как

Код


.page-body-2 { background: url(../images/page_bg_img.jpg) 50% 0 no-repeat; }

Тоесть является бэкграундом. Я взял эту картинку и заменил на свою. В приложенном файле - отметил участки, которые хочется сделать линками на шапке. В статичном Html'e реализовалось бы как-то так я предполагаю:

Код


<p>
   <img src="mypic.jpg" width="300" height="200"
        usemap="#mymap">
</p>
<map name="mymap">
   <area shape="rect" coords="0,0,99,99" href="index1.html">
   <area shape="rect" coords="99,0,100,70" href="index2.html">
</map>

А как же быть в моем примере?

Записан

Alex_iPod

Захожу иногда
187
0 / 1

Re: Как сделать логотип в шапке ссылкой

« Ответ #32 : 26.08.2010, 13:11:32 »

Цитата: Reveal от 05.08.2010, 14:40:52

Выбираем позицию модуля - обычно она так и называется logo;

К сожалению не у всех шаблонов есть позиция logo.

Записан

PashkaRu

Давно я тут
941
91 / 4
Дедушка Игнат, изыди ((((

Re: Как сделать логотип в шапке ссылкой

« Ответ #33 : 26.08.2010, 13:22:43 »

а кто мешает ее сделать самому?

Записан

+

Alex_iPod

Захожу иногда
187
0 / 1

Re: Как сделать логотип в шапке ссылкой

« Ответ #34 : 26.08.2010, 13:46:51 »

Цитата: PashkaRu от 26.08.2010, 13:22:43

а кто мешает ее сделать самому?

Признаться я с Joomla недавно, в двух словах расскажите пожалуйста, как это сделать?

Записан

PashkaRu

Давно я тут
941
91 / 4
Дедушка Игнат, изыди ((((

Re: Как сделать логотип в шапке ссылкой

« Ответ #35 : 26.08.2010, 13:57:21 »

в двух словах:
копи-паст

Записан

+

Alex_iPod

Захожу иногда
187
0 / 1

Re: Как сделать логотип в шапке ссылкой

« Ответ #36 : 26.08.2010, 14:39:06 »

Цитата: PashkaRu от 26.08.2010, 13:57:21

в двух словах:
копи-паст

Уважаемый PashkaRu, я все уже перепробовал, но результата нет.

Часть кода index.php

Код


<div id="headerinner">
					<div class="logo">
					 	<img src="images/<?php echo $this->params->get('tmlogo'); ?>" />
                        <div class="tagtext"><?php echo $this->params->get('tagLine'); ?></div>
					 </div>
					<?php if($this->countModules('top')) :?>
					<div id="topmod">
					 	<jdoc:include type="modules" name="top" style="xhtml" />
					 </div>
					<?php endif;?>
				</div>

часть кода template.css

Код


 /* Logo */
.logo {background-color:transparent;float:left;height:66px;position:relative;width:228px;margin-left: 32px; margin-top:13px;}
#login {float:left;width:69%;}
#search{float:right;width:30%; padding-top:10px; margin-right:10px; align:right; }
/* TopMod */
#topmod {float:right;height:70px;width:315px;padding-top: 34px; margin-right:20px;}
/* Mainbody */
#mainbody {margin-bottom:10px;float:left;}
#mainbody .maincontent{float:left;padding:0px 10px 0px 10px;float:left;background-color:#fff;}
#mainbody .modulecontenttop{float:left;width:100%;height:10px;}
/* Top User Modules */
#topusermods {float:left;width:588px;}
/* Duo Modules */
#duomods {float:left;width:984px;}

Я конечно понимаю что надо углубиться в HTML и CSS, но у меня щас просто нету времени, поэтому слезно прошу: уважаемые форумчане, помогите, пожалуйста, закончить проект! В противном случае приглашаю на мои похороны :-(

Записан

PashkaRu

Давно я тут
941
91 / 4
Дедушка Игнат, изыди ((((

Re: Как сделать логотип в шапке ссылкой

« Ответ #37 : 26.08.2010, 16:04:31 »

вставка модуля "лого" в шаблон:

<jdoc:include type="modules" name="logo" />

в том месте, где нужен лого.

дальше сделать модуль (как он называется-то, не помню?) html-ный, туда вставить картинку, позицию модуля указать как logo

прямо там в поле, где указывается позиция, прямо там в нем и вписать.

ВСЕ.

Записан

+

edzzie

Новичок
6
0 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #38 : 27.08.2010, 13:22:20 »

как по мне я решил проблему автора проще.

было <div id="logo"></div>
стало <a href="<?php echo JURI::base(); ?>"> <div id="logo"></div> </a>

тоесть поставил div выводящий логотип во внутрь ссылки.

Записан

danik.html

Живу я здесь
2650
353 / 4

Re: Как сделать логотип в шапке ссылкой

« Ответ #39 : 27.08.2010, 13:28:01 »

Цитата: edzzie от 27.08.2010, 13:22:20

как по мне я решил проблему автора проще.

было <div id="logo"></div>
стало <a href="<?php echo JURI::base(); ?>"> <div id="logo"></div> </a>

тоесть поставил div выводящий логотип во внутрь ссылки.

Эх, и как же тебе не стыдно в маленький худенький anchor совать толстый жирный division. Делать надо наоборот.(a - inline элемент, и не может содержать в себе блочные элементы, такие как div)

Записан

【Мегапак Virtuemart】:
• метатеги (description,keywords)
• заголовки (title)
• красивые алиасы (чпу) без тормозов и дублей!

PashkaRu

Давно я тут
941
91 / 4
Дедушка Игнат, изыди ((((

Re: Как сделать логотип в шапке ссылкой

« Ответ #40 : 27.08.2010, 14:17:58 »

на худой конец можно сделать a блоковым элементом (если в свойствах задать ему display:block). Но вставлять див в ссылку - это... конечно...

можно сделать еще примерно так же, но тока не див, а спан, спан в ссылку можно. при том, что он будет иметь свойства того же дива (если в свойствах задать ему display:block)

Записан

+

angel174

Захожу иногда
63
1 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #41 : 08.09.2010, 17:13:13 »

Спасибо, хоть и немного другое надо было, но суть ответов на мысль натолкнула....

Записан

daco77

Осваиваюсь на форуме
27
0 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #42 : 23.01.2011, 16:32:52 »

Скажите, пож-та, а если сделать так, то чем это грозит? Если честно, мне было так проще, точнее понятнее. Это будет плохо сказываться на оптимизацию?

как по мне я решил проблему автора проще.

было <div id="logo"></div>
стало <a href="<?php echo JURI::base(); ?>"> <div id="logo"></div> </a>

тоесть поставил div выводящий логотип во внутрь ссылки.

Записан

Аня

Давно я тут
745
33 / 0
Копатыч нестабилен!

Re: Как сделать логотип в шапке ссылкой

« Ответ #43 : 06.02.2011, 15:23:33 »

А реально это не всегда работает! Когда делаешь ссылку внутри дива. Вот со вставленной картинкой - другое дело.

Записан

Fatal error - это не фатально!!! Я проверила.

witas05

Новичок
5
0 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #44 : 03.03.2011, 10:31:04 »

Здравствуйте, есть сайт есть шапка во флешь, задача такая сделать эту шапку ссылкой, многое пробовал но ничего не помогает... как сделать шапку ссылкой... Вот код:

Код


<div class="art-header">
      <div class="art-header-jpeg"></div>
<script type="text/javascript" src="<?php echo $templateUrl; ?>/swfobject.js"></script>
<div id="art-flash-area">
<div id="art-flash-container">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="940" height="235" id="art-flash-object">
    <param name="movie" value="<?php echo $templateUrl; ?>/images/flash.swf" />
    <param name="quality" value="high" />
	<param name="scale" value="exactfit" />
	<param name="wmode" value="transparent" />
	<param name="flashvars" value="color1=0xFFFFFF&amp;alpha1=.70&amp;framerate1=24&amp;loop=true" />
    <param name="swfliveconnect" value="true" />
    <!--[if !IE]>-->
    <object type="application/x-shockwave-flash" data="<?php echo $templateUrl; ?>/images/flash.swf" width="940" height="235">
        <param name="quality" value="high" />
	    <param name="scale" value="exactfit" />
	    <param name="wmode" value="transparent" />
	    <param name="flashvars" value="color1=0xFFFFFF&amp;alpha1=.70&amp;framerate1=24&amp;loop=true" />
        <param name="swfliveconnect" value="true" />
    <!--<![endif]-->
      	<div class="art-flash-alt"><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></div>

Записан

Аня

Давно я тут
745
33 / 0
Копатыч нестабилен!

Re: Как сделать логотип в шапке ссылкой

« Ответ #45 : 03.03.2011, 17:23:12 »

Ну, может, действительно лучше всего модулем вставить? Флэш в модуль и там сделать ссылку на него?

Записан

Fatal error - это не фатально!!! Я проверила.

witas05

Новичок
5
0 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #46 : 03.03.2011, 17:46:09 »

Цитата: Аня от 03.03.2011, 17:23:12

Ну, может, действительно лучше всего модулем вставить? Флэш в модуль и там сделать ссылку на него?

Как вариант можно, Но если не будет установлен флешь плеер посетитель вообще не увидит шапку... а так у меня на случай заглушка стоит jpg, я слышал что можно как то на ява скрипте сделать прозрачную кнопку и в нее ссылку, но как я не знаю... не сильно силен в этом, но и не навичек вроде по подобным форумам сам все делаю разбираюсь а тут аж застрял ничего не выходит

« Последнее редактирование: 03.03.2011, 17:53:08 от witas05 »

Записан

witas05

Новичок
5
0 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #47 : 05.03.2011, 09:45:01 »

Нашел решение, поскольку была проблема переделать сам flash вшить ссылку туда, сделал флешь с кнопкой ссылки и наложил его поверх просто и вуаля все работает, вот как это у меня выглядет:

Код


<div id="art-flash-container">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="940" height="235" id="art-flash-object">
    <param name="movie" value="<?php echo $templateUrl; ?>/images/flash.swf" />
    <param name="quality" value="high" />
	<param name="scale" value="exactfit" />
	<param name="wmode" value="transparent" />
	<param name="flashvars" value="color1=0xFFFFFF&amp;alpha1=.70&amp;framerate1=24&amp;loop=true" />
    <param name="swfliveconnect" value="true" />
    <!--[if !IE]>-->
    <object type="application/x-shockwave-flash" data="<?php echo $templateUrl; ?>/images/flash.swf" width="940" height="235">
        <param name="quality" value="high" />
	    <param name="scale" value="exactfit" />
	    <param name="wmode" value="transparent" />
	    <param name="flashvars" value="color1=0xFFFFFF&amp;alpha1=.70&amp;framerate1=24&amp;loop=true" />
        <param name="swfliveconnect" value="true" />
    <!--<![endif]-->
      	<div class="art-flash-alt"><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></div>
    <!--[if !IE]>-->
    </object>
    <!--<![endif]-->
</object>
</div>
<div id="art-flash-container">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="940" height="235" id="art-flash-object">
    <param name="movie" value="<?php echo $templateUrl; ?>/images/link.swf" />
    <param name="quality" value="high" />
	<param name="scale" value="exactfit" />
	<param name="wmode" value="transparent" />
	<param name="flashvars" value="color1=0xFFFFFF&amp;alpha1=.70&amp;framerate1=24&amp;loop=true" />
    <param name="swfliveconnect" value="true" />
    <!--[if !IE]>-->
    <object type="application/x-shockwave-flash" data="<?php echo $templateUrl; ?>/images/link.swf" width="940" height="235">
        <param name="quality" value="high" />
	    <param name="scale" value="exactfit" />
	    <param name="wmode" value="transparent" />
	    <param name="flashvars" value="color1=0xFFFFFF&amp;alpha1=.70&amp;framerate1=24&amp;loop=true" />
        <param name="swfliveconnect" value="true" />
    <!--<![endif]-->
      	<div class="art-flash-alt"><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></div>

Записан

Re: Как сделать логотип в шапке ссылкой

« Ответ #48 : 03.07.2011, 14:46:25 »

Цитата: danik.html от 31.05.2010, 20:38:14

в лого вставляешь <a href="/" title="на главную"></a>
в CSS дописываешь
#logo a{
display: block;
width: 100%;
height: 100%;
}

Самый лучший совет! Спасибо огромное за четкий совет! Респект!

Записан

Аня

Давно я тут
745
33 / 0
Копатыч нестабилен!

Re: Как сделать логотип в шапке ссылкой

« Ответ #49 : 03.07.2011, 16:18:48 »

А я теперь модулем вставляю - и менять легко.

Записан

Fatal error - это не фатально!!! Я проверила.

marozz1k

Захожу иногда
316
8 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #50 : 11.07.2011, 21:55:25 »

блин все ответы прочитал, у всех div`ами сделано. А у меня в шаблоне

Код


<table width="100%"  border="0" align="center" cellpadding="0" cellspacing="0">
        <tr>
                 <td  align="center" class="logoheader">&nbsp;</td>
               
        </tr>
  </table>

Код


td.logoheader {
  margin: 0;
  padding:  0;
  background     : url(../images/header.jpg)  #fff no-repeat bottom left;
  height         : 65px;
  width          : 100%;
  
 }

Записан

Аня

Давно я тут
745
33 / 0
Копатыч нестабилен!

Re: Как сделать логотип в шапке ссылкой

« Ответ #51 : 14.07.2011, 10:18:52 »

Ну, на этот <td align="center" class="logoheader"> </td> сделай ссылку.

Записан

Fatal error - это не фатально!!! Я проверила.

marozz1k

Захожу иногда
316
8 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #52 : 14.07.2011, 11:10:21 »

не, по другому немножко.

Код


<td  align="center" class="logoheader"><a class="HeadLink"></a></td>

и ксс

Код


<td  align="center" class="logoheader"><a href="ссылочка" class="HeadLink"> </a></td>

Записан

phuntonik

Захожу иногда
90
2 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #53 : 22.09.2011, 23:25:14 »

Господа, я немного не в тему, но лучше всего работает способ, предложенный danik.html

Цитата: danik.html от 31.05.2010, 20:38:14

в лого вставляешь <a href="/" title="на главную"></a>
в CSS дописываешь
#logo a{
display: block;
width: 100%;
height: 100%;
}

только немного модифицированный. Он работает и под Denwer'ом и на хостинге и вообще, мне кажется, идеален и прост:

В лого надо вставить <a href="<?php echo $this->baseurl ?>/" title="на главную"></a>
в CSS дописываешь
#[имя_дива_с_логотипом] a{
display: block;
width: 100%;
height: [высота_картинки_с_лого_в_пикселях]px;
}

Записан

Doc

Захожу иногда
456
17 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #54 : 24.09.2011, 09:25:10 »

Может кто подскажет, все перепробовал и не фига не выходит
Дело в том, что у меня в шапке стоит как бы фото и там домик, при его нажатии попадаешь на главную и второе поиск
И если вставляю коды приведенные здесь, в теме, то эта фотка уходит с шапки вниз и я вот не пому, что бы вставлять этот код, то свой нужно удалить ?
Типа так, вот мой код

Код


<div id="logo">
<div  id="top_bar"><img border="0" src="<?php echo $this->baseurl ?>/templates/bizcity_ii/images/trans.gif" alt="" width="196" height="50" usemap="#Map" />   
</div></div>

Что бы сделать лого кликобальным, то меняем так

Код


<div id="logo">
<a href="/" title="на главную"></a> 
</div></div>

Или как ?
Подскажите, а то уж очень хочется сделать, что бы при нажатии на лого, то переходил на главную

Записан

WOOF

Осваиваюсь на форуме
12
0 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #55 : 28.11.2011, 22:32:08 »

Тут мне подсказали очень интересный код, для организации перехода. Шаблон самопальный, все сделано div'ами. Правки вносятся в index.php.

Было:

Цитировать

<div id="wrapper">

<div id="header">
<div class="runsting"><jdoc:include type="modules" name="top" /></div>
</div>

Стало:

Цитировать

<div id="wrapper">

<div id="header" style="position:relative;">
<a href="/"><div style="position:absolute; width:300px; height:300px;left:0px; top:0px;"></div></a>

<div class="runsting" ><jdoc:include type="modules" name="top" />

</div>
</div>

Работает следующим образом: Логотип картинки на сайте http://www.уютныевещи.рф теперь кликабелен и не перегружено кодом

« Последнее редактирование: 28.11.2011, 22:35:38 от WOOF »

Записан

Doc

Захожу иногда
456
17 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #56 : 29.11.2011, 10:25:03 »

У меня не какой вариант не выходит и лого так и не становиться кликобальным
Думаю разработчику написать, может он поможет

Записан

Doc

Захожу иногда
456
17 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #57 : 29.11.2011, 10:44:44 »

Во, что то получилось...
Кто знает, правильно так будет или нет
Был такой код

Код


<div id="logo">
<div  id="top_bar"><img border="0" src="<?php echo $this->baseurl ?>/templates/bizcity_ii/images/trans.gif" alt="" width="196" height="50" usemap="#Map" /> 
</div></div>

А сделал такой

Код


<a href="<?php echo JURI::base(); ?>"><div id="logo">
<div  id="top_bar"><img border="0" src="<?php echo $this->baseurl ?>/templates/bizcity_ii/images/trans.gif" alt="" width="196" height="50" usemap="#Map" /> 
</div></div>

закрывающий тег </a> не куда не ставил и больше не чего не куда не прописывал и вроде все нормально работает
Можно так оставить ? или нужно, все таки еще куда то, что то прописать ?

Записан

wiedii

Осваиваюсь на форуме
24
0 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #58 : 08.12.2011, 19:22:45 »

а можно сунуть <a href="http://сайт.ру">

в templates/rhuk_milkyway/index.php

между
<div id="header_r">
и
<div id="logo"></div>

?

Записан

alfawebstudio

Новичок
1
0 / 0

Re: Как сделать логотип в шапке ссылкой

« Ответ #59 : 27.01.2012, 19:31:36 »

Вот вы заморачиваетесь.

Если нужно сделать шапку ссылкой, просто поместите DIV-контейнер шапки в ссылку. Что-то вроде:

<a href="/"><div id="header"></div></a>

Записан

как сделать кнопки меню! Автор Millenium_3000	Ответов: 10 Просмотров: 10822	17.08.2017, 17:24:12 от Intrande
Как сделать резиновой центральную чать сайта? Автор genkey	Ответов: 8 Просмотров: 4929	28.05.2016, 10:45:37 от vipiusss
Логотип-картинка ссылкой Artisteer Автор kirill-juk	Ответов: 2 Просмотров: 2346	01.02.2016, 14:16:44 от kirill-juk
Как сделать меню вконце страницы ? Автор p4o1	Ответов: 1 Просмотров: 1699	08.04.2015, 22:46:50 от vipiusss
Как сделать так чтобы из шаблона блога категории заголовок был ссылкой, а в самом материале нет? Автор wings_fury	Ответов: 0 Просмотров: 1408	20.03.2015, 11:10:30 от wings_fury

Joomla 6 нуждается в вашей помощи с тестированием.Вышел недавно релиз Joomla 6 alpha1

Вышла Phoca Gallery 5.1.0

Вышел релиз Joomla 5.3.1Проект Joomla рад сообщить о выпуске Joomla 5.3.1

Похожие темы