Pagina 1 van 1
Plaats logo verbeteren
Geplaatst: 20 jan 2008, 22:13
door Hans Kamp
Ik ben weer met mijn forum aan het knutselen geweest, omdat de leden en ikzelf tijd vonden worden dat het logo vervangen moest worden. Het nieuwe logo is clickable terwijl bij het vorige logo alleen het WoW-logo en het woord "Nederland" clickable waren.
De problemen zijn het volgende:
- Het logo is te breed voor een scherm van 1280 bij 1024; dat is de relutie waarmee ik werk. Ik weet niet welke manieren de beste zijn om een te breed logo te verkleinen. Men kan het links en rechts afkappen, of men kan het logo verkleinen zodat het wel past. Het nadeel van afkappen is dat er een kans is dat de afkapping dwars door de Blood Elf links, en door de Draenei rechts kan gaan;
- Het logo is wat verschoven. Het logo zou naadloos moeten aansluiten in het bovenste gedeelte van de tabel, tezamen met Uitloggen [ Hans Kamp ],
0 nieuwe berichten, Help, Zoeken, Leden, Gebruikerspaneel.
De stijl was oorspronkelijk subSilver2 (een van de meegeleverde stijlen bij PHPBB3) maar die is grondig gewijzigd, dusdanig dat er van de oorspronkelijke stijl niet zo veel meer te zien is, alleen de knoppen en de icoontjes.
Het forum is te zien op
http://www.wowforum.nl
Re: Plaats logo verbeteren
Geplaatst: 21 jan 2008, 12:43
door Gamemaniak
Wat gemakkelijker is, is dat je zorgt dat het op een resolutie van 1024x768 er fatsoenlijk uitziet, en dan ziet het er op verder resoluties ook goed uit
Re: Plaats logo verbeteren
Geplaatst: 21 jan 2008, 16:43
door Coen
Gamemaniak schreef:Wat gemakkelijker is, is dat je zorgt dat het op een resolutie van 1024x768 er fatsoenlijk uitziet, en dan ziet het er op verder resoluties ook goed uit
Dit is inderdaad een optie, een breedte van 950px tot 960px zorgt ervoor dat het optimaal weergegeven kan worden op de meeste, meest gangbare resoluties.
Hans Kamp schreef:- Het logo is te breed voor een scherm van 1280 bij 1024; dat is de relutie waarmee ik werk. Ik weet niet welke manieren de beste zijn om een te breed logo te verkleinen. Men kan het links en rechts afkappen, of men kan het logo verkleinen zodat het wel past. Het nadeel van afkappen is dat er een kans is dat de afkapping dwars door de Blood Elf links, en door de Draenei rechts kan gaan;
Maak je afbeelding eens achtergrond van de div/cel waar hij in staat. Zo word hij automatisch afgekapt. Met
background-position zou je het bijvoorbeeld kunnen centreren. Ik ben wel bang dat je je plaatje iets zult aan moeten passen.
Hans Kamp schreef:- Het logo is wat verschoven. Het logo zou naadloos moeten aansluiten in het bovenste gedeelte van de tabel, tezamen met Uitloggen [ Hans Kamp ], 0 nieuwe berichten, Help, Zoeken, Leden, Gebruikerspaneel.
Probeer eerst bovenstaande oplossing, wellicht is het dan al opgelost. Anders moeten we daarna even opnieuw gaan positioneren!
Re: Plaats logo verbeteren
Geplaatst: 21 jan 2008, 17:59
door Hans Kamp
Bedankt, ik zal wat proberen... Maar ik ben niet erg thuis in de templates. De inhoud van overall_header.html is
- Spoiler: bekijk
Code: Selecteer alles
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" lang="{S_USER_LANG}" xml:lang="{S_USER_LANG}">
<head>
<meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
<meta http-equiv="content-language" content="{S_USER_LANG}" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="resource-type" content="document" />
<meta name="distribution" content="global" />
<meta name="copyright" content="2002-2006 phpBB Group" />
<meta name="keywords" content="" />
<meta name="description" content="" />
{META}
<title>{SITENAME} • <!-- IF S_IN_MCP -->{L_MCP} • <!-- ELSEIF S_IN_UCP -->{L_UCP} • <!-- ENDIF -->{PAGE_TITLE}</title>
<link rel="stylesheet" href="{T_STYLESHEET_LINK}" type="text/css" />
<script type="text/javascript">
// <![CDATA[
<!-- IF S_USER_PM_POPUP -->
if ({S_NEW_PM})
{
popup('{UA_POPUP_PM}', 400, 225, '_phpbbprivmsg');
}
<!-- ENDIF -->
function popup(url, width, height, name)
{
if (!name)
{
name = '_popup';
}
window.open(url.replace(/&/g, '&'), name, 'height=' + height + ',resizable=yes,scrollbars=yes,width=' + width);
return false;
}
function jumpto()
{
var page = prompt('{LA_JUMP_PAGE}:', '{ON_PAGE}');
var perpage = '{PER_PAGE}';
var base_url = '{A_BASE_URL}';
if (page !== null && !isNaN(page) && page > 0)
{
document.location.href = base_url.replace(/&/g, '&') + '&start=' + ((page - 1) * perpage);
}
}
/**
* Find a member
*/
function find_username(url)
{
popup(url, 760, 570, '_usersearch');
return false;
}
/**
* Mark/unmark checklist
* id = ID of parent container, name = name prefix, state = state [true/false]
*/
function marklist(id, name, state)
{
var parent = document.getElementById(id);
if (!parent)
{
eval('parent = document.' + id);
}
if (!parent)
{
return;
}
var rb = parent.getElementsByTagName('input');
for (var r = 0; r < rb.length; r++)
{
if (rb[r].name.substr(0, name.length) == name)
{
rb[r].checked = state;
}
}
}
<!-- IF ._file -->
/**
* Play quicktime file by determining it's width/height
* from the displayed rectangle area
*
* Only defined if there is a file block present.
*/
function play_qt_file(obj)
{
var rectangle = obj.GetRectangle();
if (rectangle)
{
rectangle = rectangle.split(',')
var x1 = parseInt(rectangle[0]);
var x2 = parseInt(rectangle[2]);
var y1 = parseInt(rectangle[1]);
var y2 = parseInt(rectangle[3]);
var width = (x1 < 0) ? (x1 * -1) + x2 : x2 - x1;
var height = (y1 < 0) ? (y1 * -1) + y2 : y2 - y1;
}
else
{
var width = 200;
var height = 0;
}
obj.width = width;
obj.height = height + 16;
obj.SetControllerVisible(true);
obj.Play();
}
<!-- ENDIF -->
// ]]>
</script>
<script src="http://i.thottbot.com/power.js"></script>
</head>
<body class="{S_CONTENT_DIRECTION}">
<a name="top"></a>
<!--<div id="wrapheader">-->
<div id="wrapheader" align="center">
<div id="logodesc">
<table width="100%" cellspacing="0">
<tr>
<!-- <td width="100%" align="center"><h1>{SITENAME}</h1><span class="gen">{SITE_DESCRIPTION}</span></td>-->
<!-- <td width="100%" align="center" valign="center"><h1>{SITENAME}</h1><span class="gen">{SITE_DESCRIPTION}</span></td>-->
<td width="100%" align="center" valign="center<span class="gen">{SITE_DESCRIPTION}</span></td>
<td width="100%"><a href="{U_INDEX}">{SITE_LOGO_IMG}</a></td>
</tr>
<tr>
<td colspan="2" width="100%" align="center"><h1>{SITENAME}</h1></td>
</tr>
</table>
</div>
<div id="menubar">
<table width="100%" cellspacing="0">
<tr>
<td class="genmed">
<!-- IF not S_IS_BOT --><a href="{U_LOGIN_LOGOUT}"><img src="{T_THEME_PATH}/images/icon_mini_login.gif" width="12" height="13" alt="*" /> {L_LOGIN_LOGOUT}</a> <!-- ENDIF -->
<!-- IF U_RESTORE_PERMISSIONS --> <a href="{U_RESTORE_PERMISSIONS}"><img src="{T_THEME_PATH}/images/icon_mini_login.gif" width="12" height="13" alt="*" /> {L_RESTORE_PERMISSIONS}</a><!-- ENDIF -->
<!-- IF S_BOARD_DISABLED and S_USER_LOGGED_IN --> <span style="color: red;">{L_BOARD_DISABLED}</span><!-- ENDIF -->
<!-- IF not S_IS_BOT -->
<!-- IF S_USER_LOGGED_IN -->
<!-- IF S_DISPLAY_PM --> <a href="{U_PRIVATEMSGS}"><img src="{T_THEME_PATH}/images/icon_mini_message.gif" width="12" height="13" alt="*" /> {PRIVATE_MESSAGE_INFO}<!-- IF PRIVATE_MESSAGE_INFO_UNREAD -->, {PRIVATE_MESSAGE_INFO_UNREAD}<!-- ENDIF --></a><!-- ENDIF -->
<!-- ELSE --> <a href="{U_REGISTER}"><img src="{T_THEME_PATH}/images/icon_mini_register.gif" width="12" height="13" alt="*" /> {L_REGISTER}</a>
<!-- ENDIF -->
<!-- ENDIF -->
</td>
<td class="genmed" align="{S_CONTENT_FLOW_END}">
<a href="{U_FAQ}"><img src="{T_THEME_PATH}/images/icon_mini_faq.gif" width="12" height="13" alt="*" /> {L_FAQ}</a>
<!-- IF S_DISPLAY_SEARCH --> <a href="{U_SEARCH}"><img src="{T_THEME_PATH}/images/icon_mini_search.gif" width="12" height="13" alt="*" /> {L_SEARCH}</a><!-- ENDIF -->
<!-- IF not S_IS_BOT -->
<!-- IF S_DISPLAY_MEMBERLIST --> <a href="{U_MEMBERLIST}"><img src="{T_THEME_PATH}/images/icon_mini_members.gif" width="12" height="13" alt="*" /> {L_MEMBERLIST}</a><!-- ENDIF -->
<!-- IF S_USER_LOGGED_IN --> <a href="{U_PROFILE}"><img src="{T_THEME_PATH}/images/icon_mini_profile.gif" width="12" height="13" alt="*" /> {L_PROFILE}</a><!-- ENDIF -->
<!-- ENDIF -->
</td>
</tr>
</table>
</div>
<div id="datebar">
<table width="100%" cellspacing="0">
<tr>
<td class="gensmall"><!-- IF S_USER_LOGGED_IN -->{LAST_VISIT_DATE}<!-- ENDIF --></td>
<td class="gensmall" align="{S_CONTENT_FLOW_END}">{CURRENT_TIME}<br /></td>
</tr>
</table>
</div>
</div>
<div id="wrapcentre">
<!-- IF S_DISPLAY_SEARCH -->
<p class="searchbar">
<span style="float: {S_CONTENT_FLOW_BEGIN};"><a href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a> | <a href="{U_SEARCH_ACTIVE_TOPICS}">{L_SEARCH_ACTIVE_TOPICS}</a></span>
<!-- IF S_USER_LOGGED_IN -->
<span style="float: {S_CONTENT_FLOW_END};"><a href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a> | <a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a></span>
<!-- ENDIF -->
</p>
<!-- ENDIF -->
<br style="clear: both;" />
<!-- INCLUDE breadcrumbs.html -->
<br />
Re: Plaats logo verbeteren
Geplaatst: 22 jan 2008, 20:06
door Hans Kamp
Ik heb het probleem weten op te lossen, maar ik heb nu een ander (kleiner) probleem.
Hoe maak ik de banner scalable? D.w.z. op een groot scherm wordt de banner vergroot, op een klein scherm wordt ie verkleind, maar dusdanig dat de banner altijd even groot is als de menubalk en de rest van het forum eronder.
Re: Plaats logo verbeteren
Geplaatst: 23 jan 2008, 00:32
door Coen
Hans Kamp schreef:Hoe maak ik de banner scalable? D.w.z. op een groot scherm wordt de banner vergroot, op een klein scherm wordt ie verkleind, maar dusdanig dat de banner altijd even groot is als de menubalk en de rest van het forum eronder.
Je kunt met php en
gd een afbeelding wel verkleinen, maar echt mooi zal dit niet worden.
Kun je misschien een praktisch voorbeeld geven, zodat we eventueel naar alternatieven kunnen kijken?
