How will i expand and center this? (pic)

Started by johnpaul2k2, December 09, 2012, 01:34:22 PM

Previous topic - Next topic
Print
Go Down Pages1
User actions

johnpaul2k2

December 09, 2012, 01:34:22 PM Last Edit: December 10, 2012, 05:36:30 AM by johnpaul2k2
I don't know much on Centering Forum home page Logo,

1.  how will i center my home page logo because i want to add a bigger Logo that may occupy the whole space  :D
2.  how will i expand the height of my menu bar??

johnpaul2k2

#1
December 10, 2012, 10:46:56 AM
i just tried it but was making mistaks. i couldn't get the position right

IchBin™

#2
December 10, 2012, 12:07:15 PM
Is the logo something you added? Can you post the code for your logo, as well as a few lines above and below that.
IchBin™        TinyPortal

johnpaul2k2

#3
December 10, 2012, 12:46:12 PM
i don't know much about it . this is everything inside <head> to </head> inside /public_html/Themes/premiummgc/index.template.php

Code Select
<head>';

// The ?fin20 part of this link is just here to make sure browsers don't cache it wrongly.
echo '
<link rel="stylesheet" type="text/css" href="', $settings['theme_url'], '/css/index', $context['theme_variant'], '.css?fin20" />';

// Some browsers need an extra stylesheet due to bugs/compatibility issues.
foreach (array('ie7', 'ie6', 'webkit') as $cssfix)
if ($context['browser']['is_' . $cssfix])
echo '
<link rel="stylesheet" type="text/css" href="', $settings['default_theme_url'], '/css/', $cssfix, '.css" />';

// RTL languages require an additional stylesheet.
if ($context['right_to_left'])
echo '
<link rel="stylesheet" type="text/css" href="', $settings['theme_url'], '/css/rtl.css" />';

// Here comes the JavaScript bits!
echo '
        <script src="http://px.smowtion.com/validate?sid=170964" type="text/javascript"></script>
<script type="text/javascript" src="', $settings['default_theme_url'], '/scripts/script.js?fin20"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="', $settings['theme_url'], '/scripts/theme.js?fin20"></script>
<script type="text/javascript"><!-- // --><![CDATA[
var smf_theme_url = "', $settings['theme_url'], '";
var smf_default_theme_url = "', $settings['default_theme_url'], '";
var smf_images_url = "', $settings['images_url'], '";
var smf_scripturl = "', $scripturl, '";
var smf_iso_case_folding = ', $context['server']['iso_case_folding'] ? 'true' : 'false', ';
var smf_charset = "', $context['character_set'], '";', $context['show_pm_popup'] ? '
var fPmPopup = function ()
{
if (confirm("' . $txt['show_personal_messages'] . '"))
window.open(smf_prepareScriptUrl(smf_scripturl) + "action=pm");
}
addLoadEvent(fPmPopup);' : '', '
var ajax_notification_text = "', $txt['ajax_in_progress'], '";
var ajax_notification_cancel_text = "', $txt['modify_cancel'], '";
// ]]></script>';

echo '
        <meta name="DC.Publisher" content="ify paul" >
        <meta name="alexaVerifyID" content="uypbTxKBU2pA3p7BgvaRA5Gq17o" />
        <meta http-equiv="Content-Language" content="en">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="description" content="', $context['page_title_html_safe'], '" />', !empty($context['meta_keywords']) ? '
<meta name="keywords" content="' . $context['meta_keywords'] . '" />' : '', '
<title>', $context['page_title_html_safe'], '</title>';

// Please don't index these Mr Robot.
if (!empty($context['robot_no_index']))
echo '
<meta name="robots" content="noindex" />';

// Present a canonical url for search engines to prevent duplicate content in their indices.
if (!empty($context['canonical_url']))
echo '
<link rel="canonical" href="', $context['canonical_url'], '" />';

// Show all the relative links, such as help, search, contents, and the like.
echo '
<link rel="help" href="', $scripturl, '?action=help" />
<link rel="search" href="', $scripturl, '?action=search" />
<link rel="contents" href="', $scripturl, '" />';

// If RSS feeds are enabled, advertise the presence of one.
if (!empty($modSettings['xmlnews_enable']) && (!empty($modSettings['allow_guestAccess']) || $context['user']['is_logged']))
echo '
<link rel="alternate" type="application/rss+xml" title="', $context['forum_name_html_safe'], ' - ', $txt['rss'], '" href="', $scripturl, '?type=rss;action=.xml" />';

// If we're viewing a topic, these should be the previous and next topics, respectively.
if (!empty($context['current_topic']))
echo '
<link rel="prev" href="', $scripturl, '?topic=', $context['current_topic'], '.0;prev_next=prev" />
<link rel="next" href="', $scripturl, '?topic=', $context['current_topic'], '.0;prev_next=next" />';

// If we're in a board, or a topic for that matter, the index will be the board's index.
if (!empty($context['current_board']))
echo '
<link rel="index" href="', $scripturl, '?board=', $context['current_board'], '.0" />';

// Output any remaining HTML headers. (from mods, maybe?)
echo $context['html_headers'];

echo '
</head>

IchBin™

#4
December 10, 2012, 12:50:57 PM
That's not what is needed. Since I noticed you have a link in your signature that shows what you are talking about, I was able to see what you need.

Find in your Themes/custom_theme/css/index.css this section:
h1.forumtitle {

Add text-align: center; to it, and remove float: left;.
IchBin™        TinyPortal

johnpaul2k2

#5
December 10, 2012, 01:21:39 PM
thanks.....i think it's working,

what of the menu height ??? please what is the code?

IchBin™

#6
December 10, 2012, 02:33:55 PM
You won't be able to make the menu bigger without making the background image for it bigger as well. You have to change the height attribute in this section:

#main_menu {

And this section:
.dropmenu li a.firstlevel span.firstlevel {

But changing the height to fit a bigger menu requires you to edit the background image to fit your new height.
IchBin™        TinyPortal

Antechinus

#7
December 10, 2012, 02:36:31 PM
These days I think it's better to recommend that people use css3 for their buttons. It'll resize with browser text size, and for people who aren't good with gfx it's a lot easier.

IchBin™

#8
December 10, 2012, 02:53:34 PM
Quote from: Antechinus on December 10, 2012, 02:36:31 PM
These days I think it's better to recommend that people use css3 for their buttons. It'll resize with browser text size, and for people who aren't good with gfx it's a lot easier.

Totally agree. Graphics are not worth the trouble or such a simple menu IMO.
IchBin™        TinyPortal

Antechinus

#9
December 10, 2012, 03:08:50 PM
So I suppose we should tell him how to do it then. :D

Find this:

Code Select
/* the active button */
.dropmenu li a.active
{
background: url(../images/theme/menu_gfx.png) no-repeat 100% 0;
color: #fff;
font-weight: bold;
}
.dropmenu li a.active span.firstlevel
{
background: url(../images/theme/menu_gfx.png) no-repeat 0 0;
}
/* the hover effects */
.dropmenu li a.firstlevel:hover, .dropmenu li:hover a.firstlevel
{
background: url(../images/theme/menu_gfx.png) no-repeat 100% -30px;
color: #fff;
cursor: pointer;
text-decoration: none;
}
.dropmenu li a.firstlevel:hover span.firstlevel, .dropmenu li:hover a.firstlevel span.firstlevel
{
background: url(../images/theme/menu_gfx.png) no-repeat 0 -30px;
}

Change that steaming pile to this:

Code Select
/* the active button */
.dropmenu li a.active
{
background: #fd9604;
color: #fff;
font-weight: bold;
border-radius: 4px;
}
/* the hover effects */
.dropmenu li a.firstlevel:hover, .dropmenu li:hover a.firstlevel
{
background: #5a6c85;
color: #fff;
border-radius: 4px;
cursor: pointer;
text-decoration: none;
}


Then you can change height, font-size and paddings here:

Code Select
.dropmenu li a.firstlevel span.firstlevel
{
display: block;
position: relative;
left: -5px;
padding-left: 5px;
height: 22px;
line-height: 19px;
white-space: pre;
}

2.0.x menu markup is horrible. :D

johnpaul2k2

#10
December 11, 2012, 06:14:15 AM
will this code given...able me to remove the color? you see the color didn't really match. i want it to left with the "Milk color"

passre8939

#11
December 11, 2012, 06:37:39 AM
CSS3 is probably the best for today use as the user requirements.

johnpaul2k2

#12
December 11, 2012, 06:50:47 AM Last Edit: December 11, 2012, 07:29:45 AM by johnpaul2k2
maybe i will learn that one later..............i really need to set my this. to remove the grey color so it will remain plain ( milk color)

IchBin™

#13
December 11, 2012, 10:34:51 AM
If I get what you are asking about, that is an image. So you need to change the image with an editor, or remove the image and place the background color the way you want. Look for #header in your CSS file.
IchBin™        TinyPortal

johnpaul2k2

#14
December 11, 2012, 11:23:41 AM
please i just attached my css/index.css file. i don't really know much about css
please help identify the main thing to change there . my forum url is www.topnichez.com

thanks alot
Print
Go Up Pages1
User actions
Advertisement: