Header zentrieren - Style nicht zu finden

In diesem Forum kann man Fragen zur Programmierung stellen, die bei der Entwicklung von Mods für phpBB 3.0.x oder dem Modifizieren des eigenen Forums auftauchen.
Forumsregeln
phpBB 3.0 hat das Ende seiner Lebenszeit überschritten
phpBB 3.0 wird nicht mehr aktiv unterstützt. Insbesondere werden - auch bei Sicherheitslücken - keine Patches mehr bereitgestellt. Der Einsatz von phpBB 3.0 erfolgt daher auf eigene Gefahr. Wir empfehlen einen Umstieg auf phpBB 3.1, welches aktiv weiterentwickelt wird und für welches regelmäßig Updates zur Verfügung gestellt werden.
Begbie
Mitglied
Beiträge: 3
Registriert: 29.07.2016 15:44

Header zentrieren - Style nicht zu finden

Beitragvon Begbie » 29.07.2016 15:56

Hallo Zusammen,

wir von http://www.konsolensportfreunde.de haben unser Forum relaunched und einen vorgefertigten Style integriert.

Leider basiert dieser nicht auf subsilver o. ä. uns Bekannten, wodurch wir selbst durch googeln keine bereits besprochenen Themen zu diesem Style finden wo wir etwas rausziehen können.

Der Style heißt "Ciquala" und die Basis ist ein Style mit dem Namen "Belgelerim".

Da wir nicht nicht das technische Verständnis der Programmiersprache haben hier ein Auszug aus dem Header-Template:

Code: Alles auswählen

<title>{SITENAME} &bull; <!-- IF S_IN_MCP -->{L_MCP} &bull; <!-- ELSEIF S_IN_UCP -->{L_UCP} &bull; <!-- ENDIF -->{PAGE_TITLE}</title>

<
link rel="stylesheet" href="{T_STYLESHEET_LINK}" type="text/css" />
<
link rel="stylesheet" href="{T_THEME_PATH}/tab.css" type="text/css" />
<
script type="text/javascript" src="{T_THEME_PATH}/prototype.lite.js"></script>
<script type="text/javascript" src="{T_THEME_PATH}/moo.fx.js"></script>
<script type="text/javascript" src="{T_THEME_PATH}/moo.fx.pack.js"></script>
<script type="text/javascript">
function init(){
    var stretchers = document.getElementsByClassName('box');
    var toggles = document.getElementsByClassName('tab');
    var myAccordion = new fx.Accordion(
        toggles, stretchers, {opacity: false, height: true, duration: 600}
    );
    //hash functions
    var found = false;
    toggles.each(function(h3, i){
        var div = Element.find(h3, 'nextSibling');
            if (window.location.href.indexOf(h3.title) > 0) {
                myAccordion.showThisHideOpen(div);
                found = true;
            }
        });
        if (!found) myAccordion.showThisHideOpen(stretchers[0]);
}
</script>
<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(/&amp;/g, '&'), name, 'height=' + height + ',resizable=yes,scrollbars=yes,width=' + width);
    return false;
}

function jumpto()
{
    var page = prompt('{LA_JUMP_PAGE}:', '{ON_PAGE}');
    var per_page = '{PER_PAGE}';
    var base_url = '{A_BASE_URL}';

    if (page !== null && !isNaN(page) && page == Math.floor(page) && page > 0)
    {
        if (base_url.indexOf('?') == -1)
        {
            document.location.href = base_url + '?start=' + ((page - 1) * per_page);
        }
        else
        {
            document.location.href = base_url.replace(/&amp;/g, '&') + '&start=' + ((page - 1) * per_page);
        }
    }
}

/**
* 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>
</head>
<body class="{S_CONTENT_DIRECTION}" background="{T_THEME_PATH}/images/bg.gif">

<a name="top"></a>
<center>
<table width="85%" cellspacing="0" cellpadding="0" border="0">
<tr>
            <td class="wrapline" div id="wrapheader">
    <div id="logodesc">
        <table width="100%" cellspacing="0">
        <tr>
            <td><a href="{U_INDEX}">{SITE_LOGO_IMG}</a></td>
            <td width="100%" align="center"><b>&nbsp;&nbsp;&nbsp;&nbsp;</td>
        </tr>
        </table>
    </div>

<div id="menubar">
        <table width="100%" cellspacing="0">
<tr>
    <th height="17">
    <table width="100%" cellspacing="0">
            <td class="gensmall">
                <!-- 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>&nbsp;<!-- ENDIF -->
                <!-- IF U_RESTORE_PERMISSIONS --> &nbsp;<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 --> &nbsp;<span style="color: red;">{L_BOARD_DISABLED}</span><!-- ENDIF -->
                <!-- IF not S_IS_BOT -->
                    <!-- IF S_USER_LOGGED_IN -->
                        <!-- IF S_DISPLAY_PM --> &nbsp;<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 -->
                    <!-- ELSEIF S_REGISTER_ENABLED --> &nbsp;<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="gensmall" 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 -->&nbsp; &nbsp;<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 -->&nbsp; &nbsp;<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 -->&nbsp; &nbsp;<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>
    </th>
  </tr>
</table>

    <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="diskenarlik">
    <table width="100%"  border="0" cellpadding="0" cellspacing="0" bgcolor="#EDEDED">
      
    </table>
    <div id="ickenarlik">
<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 />


Kann uns hier jemand helfen bei der Zentrierung des Header?

Gruß, Begbie

Talk19zehn
Ehemaliger
Beiträge: 4391
Registriert: 08.06.2009 12:03

Re: Header zentrieren - Style nicht zu finden

Beitragvon Talk19zehn » 29.07.2016 16:18

Hi, nur mal spontan und laut gedacht: width="100%" align="center" der Zelle ggf. zufügen.

Code: Alles auswählen

<td><a href="{U_INDEX}">{SITE_LOGO_IMG}</a></td>


Code: Alles auswählen

<td width="100%" align="center"><a href="{U_INDEX}">{SITE_LOGO_IMG}</a></td>


Ob das nun ausreicht, prüfe bitte auch mittels W3C-Validierung. Ich habe nämlich schon lang nicht mehr mit Tabellen gearbeitet. :wink:
Im Grunde könnte man "besser" das CSS anpassen. Jedoch das Design finde ich nirgends auf Anhieb. Die obige Codierung ist lediglich Firebug entnommen und sieht bei dir ggf. anders aus und HTML-Verschachtelungen habe ich nicht näher und auch nicht in der Konsequenz untersucht. Daher alles ohne Gewähr, nur ein grober Hinweis bezogen auf deine Eingangsfrage.

Grüße

Begbie
Mitglied
Beiträge: 3
Registriert: 29.07.2016 15:44

Re: Header zentrieren - Style nicht zu finden

Beitragvon Begbie » 29.07.2016 21:46

Hi, habe das was Du beschrieben hast nicht umsetzen können (weil nix gefunden)... Völlig Noob halt. :(

Habe den Stylesheet geöffnet und dort steht dass diese Version von der Basis her sogar subsilver sein soll.

Ich vermute dass hier in dem Bereich etwas geändert werden muss!? Ist zumindest der Bereich wo was von Header etc. steht.

Sorry wenn ich das hier nicht so genau definiert erklären kann alles. :oops:

Code: Alles auswählen

#wrapmain {
    width: 85%; 
    background
-color: #ffffff;
    border-style: solid;
    border-color: #454545; 
    border-right: 5px solid #9ace21;
    border-left: 5px solid #9ace21;
    text-align:left;
}


#wrapheader {
    height: 103px;
    background-image: url('images/background.gif');
    background-repeat: repeat-x;
    text-align:left; padding-left:0px; padding-right:0px; padding-top:0; padding-bottom:0px
}

#wrapcentre {
    margin: 15px 10px 0 10px;
}

#wrapfooter {
    text-align: center;
    clear: both;
}

#wrapnav {
    width: 85%;
    margin: 0;
    background-color: #ECECEC;
    border-width: 1px;
    border-style: solid;
    border-color: #454545;
}

#logodesc {

}

#menubar {

}

#datebar {
    margin: 10px 25px 0 25px;
}

#findbar {
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
}

.
forumrules {
    background-color: #111111;
    border-width: 2px;
    border-style: solid;
    border-color: #ff0000;
    padding: 1px;
    font-weight: normal;
    font-size: 1.1em;
    font-family: "Lucida Sans Unicode", "Lucida Sans", verdana, arial, helvetica;
}

.
forumrules h3 {
    color: #666666;
}

#pageheader { }
#pagecontent { }
#pagefooter { }

#poll { }
#postrow { }
#postdata { }   


Danke dass Du dir die Mühe machst! :)

Talk19zehn
Ehemaliger
Beiträge: 4391
Registriert: 08.06.2009 12:03

Re: Header zentrieren - Style nicht zu finden

Beitragvon Talk19zehn » 29.07.2016 22:17

Hi, du hast in deinem Startbeitrag die HTML verlinkt und darin befindet sich jene Zelle der Tabelle. Schau einfach mal...
Verstehe, ich werde mich nicht in das CSS von subsilver2, welches leider in kommenden neuen phpBB-Versionen seitens der Entwickler nicht mehr vertreten sein wird. In ein Design, welches ich nie auf Basis von phpBB-3.0 (!) genutzt habe, kann ich nicht verbindlich unterstützen, mich einarbeiten. Es waren meinerseits Hinweise und wenn du gern ein Forum betreust, betreibst, hilft es, wenn du dich in die Materie einarbeitest. Aller Anfang ist schwer - gewiss. Du schaffst das!!

Bedenke bitte: Siehe ggf. erneut den obigen Hinweis zu den ....

Forumsregeln
phpBB 3.0 hat das Ende seiner Lebenszeit überschritten
phpBB 3.0 wird nicht mehr aktiv unterstützt. Insbesondere werden - auch bei Sicherheitslücken - keine Patches mehr bereitgestellt. Der Einsatz von phpBB 3.0 erfolgt daher auf eigene Gefahr. Wir empfehlen einen Umstieg auf phpBB 3.1, welches aktiv weiterentwickelt wird und für welches regelmäßig Updates zur Verfügung gestellt werden.


Es mag Anwender geben, die auf Basis von phpBB-3.0 subsilver2 aus dem FF noch immer beherrschen. Ich habe das Design vor langer Zeit aufgegeben und setzte aus prosilver. Ich schrieb, was du im erwähnten Template ändern könntest (ohne Gewähr und ohne neuere W3C-Validatoren in Anspruch genommen zu haben).

Viele Grüße

Lehrling
Supporter
Supporter
Beiträge: 2922
Registriert: 15.01.2012 20:00
Kontaktdaten:

Re: Header zentrieren - Style nicht zu finden

Beitragvon Lehrling » 30.07.2016 00:02

Du könntest das mal ausprobieren:
Öffne das stylesheet.css und finde folgende Stelle

Code: Alles auswählen

/* Misc
 ------------ */
img {
   border: none;
}

Danach fügst du das ein:

Code: Alles auswählen

.headerimg {
       border: none;
       margin-left: 75px;
}

Dann öffnest du die Datei overall_header.html und suchst nach dieser Stelle:

Code: Alles auswählen

<td><a href="./index.php"><img src="./styles/Ciquala/imageset/LOGOFINAL%20Kopie.png" width="950" height="250" alt="" title="" /></a></td>

Diese ersetzt du durch

Code: Alles auswählen

<td><a href="./index.php"><img class="headerimg" src="./styles/Ciquala/imageset/LOGOFINAL%20Kopie.png" width="950" height="250" alt="" title="" /></a></td>

Danach leerst du den Cache im Administrationsbereich. Den Wert für margin-left im stylesheet kannst du anpassen.

Begbie
Mitglied
Beiträge: 3
Registriert: 29.07.2016 15:44

Re: Header zentrieren - Style nicht zu finden

Beitragvon Begbie » 30.07.2016 09:53

Talk19zehn hat geschrieben:Hi, nur mal spontan und laut gedacht: width="100%" align="center" der Zelle ggf. zufügen.

Code: Alles auswählen

<td><a href="{U_INDEX}">{SITE_LOGO_IMG}</a></td>


Code: Alles auswählen

<td width="100%" align="center"><a href="{U_INDEX}">{SITE_LOGO_IMG}</a></td>


Ob das nun ausreicht, prüfe bitte auch mittels W3C-Validierung. Ich habe nämlich schon lang nicht mehr mit Tabellen gearbeitet. :wink:
Im Grunde könnte man "besser" das CSS anpassen. Jedoch das Design finde ich nirgends auf Anhieb. Die obige Codierung ist lediglich Firebug entnommen und sieht bei dir ggf. anders aus und HTML-Verschachtelungen habe ich nicht näher und auch nicht in der Konsequenz untersucht. Daher alles ohne Gewähr, nur ein grober Hinweis bezogen auf deine Eingangsfrage.

Grüße


Das hat allen Ernstes schon ausgereicht! :grin:

SUPER, Vielen Dank!

Ein schönes Wochenende Euch beiden.


Zurück zu „[3.0.x] Mod Bastelstube“