MyBB.de Forum
Grafik verlinken - Druckversion

+- MyBB.de Forum (https://www.mybb.de/forum)
+-- Forum: Anpassungen (https://www.mybb.de/forum/forum-47.html)
+--- Forum: Theme-Diskussionen (https://www.mybb.de/forum/forum-84.html)
+--- Thema: Grafik verlinken (/thread-24999.html)

Seiten: Seiten: 1 2 3

RE: Grafik verlinken - Kenny - 20.02.2012

(20.02.2012, 13:53)furiify schrieb: Ich wusste nicht, wo ich das rein tun soll, was du mir geschickt hast. Habs dann einfach mal in .header getan und die "?" durch Zahlenwerte ersetzt. Da das nicht geklappt hat, hab ich die wieder gelöscht und seitdem ist es putt. :/

Harest hat doch in seinem Beitrag geschrieben wo was hinkommt.

Einfach mal irgendwo hin machen und schauen was kommt ist nun wirklich nicht unbedingt das schlaueste um es mal gelinde auszudrücken. Du solltest dir angewöhnen VOR etwaigen Änderungen den Inhalt z.b. eines Templates zu sichern. Zur Not kannst du das entsprechende Template auch zurück setzen.

RE: Grafik verlinken - furiify - 20.02.2012

(20.02.2012, 14:12)Kenny schrieb:
(20.02.2012, 13:53)furiify schrieb: Ich wusste nicht, wo ich das rein tun soll, was du mir geschickt hast. Habs dann einfach mal in .header getan und die "?" durch Zahlenwerte ersetzt. Da das nicht geklappt hat, hab ich die wieder gelöscht und seitdem ist es putt. :/

Harest hat doch in seinem Beitrag geschrieben wo was hinkommt.

Einfach mal irgendwo hin machen und schauen was kommt ist nun wirklich nicht unbedingt das schlaueste um es mal gelinde auszudrücken. Du solltest dir angewöhnen VOR etwaigen Änderungen den Inhalt z.b. eines Templates zu sichern. Zur Not kannst du das entsprechende Template auch zurück setzen.

Ja, in der global.css sind halt mehrere Sachen die ich wählen kann?!
#bottommenu, #container, #footer, uvm.

RE: Grafik verlinken - Harest - 20.02.2012

Nachdem ich mir das Theme installiert und meine Anweisungen befolgt habe sieht es wie folgt aus (siehe Anhang).

Jetzt nocheinmal der Reihe nach.

Teil 1

AdminCP -> Templates & Style -> Templates -> Dark Fusion (1.6.x) -> Seitenkopf Templates -> header

Sieht bei mir jetzt so aus:
Code:
<a name="top" id="top"></a>
<div id="panel">{$welcomeblock}</div>
<br><br>

<div class="header_right">
<div class="menu">
<ul>
<li><a href="{$mybb->settings['bburl']}/portal.php" class="portal"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/icons/home.png" alt="" title="" />{$lang->toplinks_portal}</a></li>
<li><a href="{$mybb->settings['bburl']}/index.php" class="index"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/icons/forums.png" alt="" title="" />Forums</a></li>
<li><a href="{$mybb->settings['bburl']}/search.php" class="search"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/icons/search.png" alt="" title="" />{$lang->toplinks_search}</a></li>
<li><a href="{$mybb->settings['bburl']}/memberlist.php" class="members"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/icons/memberlist.png" alt="" title="" />Members</a></li>
<li><a href="{$mybb->settings['bburl']}/calendar.php" class="calendar"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/icons/calendar.png" alt="" title="" />{$lang->toplinks_calendar}</a></li>
<li><a href="{$mybb->settings['bburl']}/misc.php?action=help" class="help"><img src="{$mybb->settings['bburl']}/{$theme['imgdir']}/icons/help.png" alt="" title="" />{$lang->toplinks_help}</a></li>
</ul>
</div>
<div class="menu2">
<ul>
<li><img src="[PFAD ZUM TEAMSPEAK-BILD]" alt="Teamspeak" />&nbsp;<a href="[TEAMSPEAK-LINK]">Teamspeak</a></li>
<li><img src="[PFAD ZUM STEAM-BILD]" alt="Steam" />&nbsp;<a href="[STEAM-LINK]">Steam</a></li>
<li><img src="[PFAD ZUM FACEBOOK-BILD]" alt="Facebook" />&nbsp;<a href="[FACEBOOK-LINK]">Facebook</a></li>
<li><img src="[PFAD ZUM TWITTER-BILD]" alt="Twitter" />&nbsp;<a href="[TWITTER-LINK]">Twitter</a></li>
</ul>
</div>
</div>
</div>

<div class="header">
<div class="header_in">
<div class="logo"><a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" title="{$mybb->settings['bbname']}" /></a></div>
            
</div>
</div>
</div>

<br>
<br>

<div id="container">
<div id="content">
<navigation>

<hr class="hidden" />
<br class="clear" />
{$bannedwarning}
{$bbclosedwarning}
{$unreadreports}
{$pending_joinrequests}
{$pm_notice}
            <br />

Die Angaben in den eckigen Klammern "[ ]" musst du durch eigene Links ersetzen. Zum einen durch die Links zu Twitter, Facebook, Steam und Teamspeak, zum anderen duch die Links zu den passenden Bildern. Andernfalls werden sie wie in meinem Screenshot nicht angezeigt.
Wenn du die Bilder direkt in den Ordner "/images/darkfusion/" kopierst würde der Link zum Twitterbild etwa so aussehen:
Code:
<img src="images/darkfusion/twitter.gif" alt="Twitter" />

Teil 2

AdminCP -> Templates & Style -> Themes -> Dark Fusion (1.6.x) -> global.css -> Stylesheet bearbeiten: Fortgeschrittene Methode

Sieht bei mir jetzt so aus:
Code:
body {
    background: #1a1a1a url(images/darkfusion/style/body_bg.png) top left repeat;
    line-height: 1.4;
    margin: auto auto;
    padding-bottom: 20px;
    color: #000;
    text-align: center;
    font-family: tahoma;
    font-size: 11px;
}

a:link {
    color: #0e79ca;
    text-decoration: none;
}

a:visited {
    color: #0e79ca;
    text-decoration: none;
}

a:hover, a:active {
    color: #1399ff;
    text-decoration: none;
}

a:focus {
outline: none;
}

.header {
    background: #070707 url(images/darkfusion/style/header_bg.png) bottom left repeat;
    text-align: center;
        width: 100%;
    height: 144px;
}

.header_right {
    background: url(images/darkfusion/style/header_right.png) top left no-repeat;
    height: 96px;
        width: 530px;
        padding-top: 50px;
        padding-right: 20px;
        float: right;
}

.header_in {
    margin: auto auto;
}

.logo {
    float: left;
        margin-top: 40px;
        margin-left: 20px;
}

#container {
    background: #101010;
        border: 1px solid #2a2a2a;
    width: 95%;
    color: #808080;
    margin: auto auto;
    padding: 20px;
    text-align: left;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
}

#content {
    width: auto !important;
}

#footer {
        width: 95%;
        color: #fff;
        margin: auto auto;
        padding: 10px 20px 20px 20px;
        text-align: left;
        text-shadow: 0 1px 0 #000;
}

.menu {
    width: 540px;
        padding-right: 20px;
}

.menu ul {
    width: 540px;
        float: right;
    color: #fff;
    font-weight: bold;
    text-align: right;
}

.menu ul a:link, .menu a:visited {
    background: url(images/darkfusion/style/menu_bg.png) top left repeat-x;
        width: 90px;
    padding: 9px 7px 8px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    color: #fff;
    text-decoration: none;
        text-shadow: 0 -1px 0 #202020;
}

.menu ul a:hover, .menu ul a:active {
    background: url(images/darkfusion/style/menu_bg.png) top left repeat-x;
        width: 90px;
    padding: 9px 7px 8px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    color: #fff;
    text-decoration: none;
        text-shadow: 0 -1px 0 #202020;
}

.menu2 {
position: relative;
margin-top: 65px;
margin-right: 10px;
text.-align: right;
}
.menu2 ul, .menu2 li {
list-style: none;
margin: 0;
padding: 0;
}
.menu2 li {
float: right;
margin-right: 5px;
}
.menu2 img {
vertical-align: bottom;
}

#calendar .calendar, #portal .portal, #index .index, #search .search, #members .members, #help .help {
    background: url(images/darkfusion/style/menu_active.png) top left repeat-x;
    padding: 9px 7px 8px;
    color: #000;
    text-decoration: none;
        text-shadow: 0 1px 0 #33adff;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}


#panel {
    background: url(images/darkfusion/style/panel_bg.png) top left repeat-x;
    width: 100%;
    padding: 8px 0px 8px 0px;
    position: fixed;
    z-index: 9999;
        top: 0;
    color: #000;
    font-family: tahoma;
    font-size: 11px;
        text-shadow: 0 1px 0 #fff;
}

#panel .remember_me input {
    vertical-align: middle;
    margin-top: 2px;
}

table {
    color: #808080;
    font-family: tahoma, arial;
    font-size: 11px;
        text-shadow: 0 -1px 0px #101010;
}

.tborder {
    background: #111111;
    width: 100%;
    margin: auto auto;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

.thead {
    background: #0256d8 url(images/darkfusion/style/thead_bg.png) top left repeat-x;
    color: #ffffff;
        padding: 5px 10px 5px 10px;
    -moz-border-radius-topleft: 4px;
    -webkit-border-top-left-radius: 4px;
    -moz-border-radius-topright: 4px;
    -webkit-border-top-right-radius: 4px;
    text-shadow: 0 -1px 0 #003c98;
}

.thead a:link {
    color: #ffffff;
    text-decoration: none;
}

.thead a:visited {
    color: #ffffff;
    text-decoration: none;
}

.thead a:hover, .thead a:active {
    color: #ffffff;
    text-decoration: underline;
}

.tcat {
    background: #151515;
    color: #808080;
    font-size: 11px;
        padding: 3px 10px 3px 10px;
    border-left: 1px solid #252525;
}

.tcat a:link {
    color: #808080;
}

.tcat a:visited {
    color: #808080;
}

.tcat a:hover, .tcat a:active {
    color: #909090;
}

.trow1 {
    background: #1a1a1a url(images/darkfusion/style/trow_bg.png) top left repeat-x;
    border-top: 1px solid #292929;
    border-left: 1px solid #292929;
}

.trow2 {
    background: #1a1a1a url(images/darkfusion/style/trow_bg.png) top left repeat-x;
    border-top: 1px solid #292929;
    border-left: 1px solid #292929;
}

.trow_h {
    background: #1a1a1a url(images/darkfusion/style/trow_bg.png) top left repeat-x;
    border-top: 1px solid #292929;
    border-left: 1px solid #292929;
}

.trow_h:hover {
    background: #252525 url(images/darkfusion/style/trow_hover_bg.png) top left repeat-x;
    border-top: 1px solid #292929;
    border-left: 1px solid #292929;
}

.trow_plain {
    background: #1a1a1a url(images/darkfusion/style/trow_bg.png) top left repeat-x;
}

.trow_shaded {
    background: #303030;
}

.trow_selected td {
    background: #000;
}

.trow_sep {
    background: #2a2a2a;
        padding: 5px 10px 5px 10px;
    color: #808080;
    font-size: 11px;
    font-weight: bold;
}

.tfoot {
    background: #0256d8 url(images/darkfusion/style/thead_bg.png) top left repeat-x;
    color: #ffffff;
        padding: 5px 10px 5px 10px;
    -moz-border-radius-bottomleft: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-bottomright: 4px;
    -webkit-border-bottom-right-radius: 4px;
    text-shadow: 0 -1px 0 #003c98;
}

.tfoot a:link {
    color: #ffffff;
    text-decoration: none;
}

.tfoot a:visited {
    color: #ffffff;
    text-decoration: none;
}

.tfoot a:hover, .tfoot a:active {
    color: #ffffff;
    text-decoration: underline;
}

#bottommenu {
        margin: auto;
    padding: 10px;
    color: #303030;
        font-size: 11px;
        font-weight: bold;
        text-align: middle;
}

#bottommenu img {
    padding-right: 5px;
    vertical-align: top;
}

#bottommenu a:link, #bottommenu a:visited {
       margin: 0 5px;
}

.navigation {
    background: #1a1a1a url(images/darkfusion/style/trow_bg.png) top left repeat-x;
        padding: 5px;
    border: 1px solid #292929;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    color: #808080;
    font-size: 11px;
    font-weight: bold;
}

.navigation a:link {
    text-decoration: none;
    color: #0e79ca;
}

.navigation a:visited {
    text-decoration: none;
    color: #0e79ca;
}

.navigation a:hover, .navigation a:active {
    text-decoration: none;
    color: #808080;
}

.navigation .active {
    color: #808080;
    font-weight: bold;
}

.smalltext {
    font-size: 11px;
}

.largetext {
    font-size: 14px;
    font-weight: bold;
        font-family: arial;
}

input.textbox {
    background: #fff url(images/darkfusion/style/textbox_bg.png) bottom left repeat-x;
    color: #000;
    border-top: 1px solid #bababa;
        border-left: none;
        border-bottom: none;
        border-right: none;
    padding: 3px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    font-family: tahoma;
    font-size: 11px;
}

input.button {
    background: #e0e0e0 url(images/darkfusion/style/button_bg.png) bottom left repeat-x;
    color: #000;
    border: 1px solid #bababa;
    padding: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    font-weight: bold;
    font-family: tahoma;
    font-size: 11px;
        text-shadow: 0 1px 0 #e0e0e0;
}

textarea {
    background: #181818;
    color: #808080;
    border: 1px solid #121212;
    padding: 2px;
    font-family: Verdana, Arial, Sans-Serif;
    line-height: 1.4;
    font-size: 13px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
        -moz-box-shadow: 0px 0px 1px #404040;
        -webkit-box-shadow: 0px 0px 1px #404040;
        box-shadow: 0px 0px 1px #404040;
        -khtml-box-shadow: 0px 0px 1px #404040;
}

select {
    background: #101010;
    color: #808080;
    border: 1px solid #303030;
}

.editor {
    background: #f1f1f1;
    border: 1px solid #ccc;
}

.editor_control_bar {
    background: #fff;
    border: 1px solid #0f5c8e;
}

.autocomplete {
    background: #fff;
    border: 1px solid #000;
    color: black;
}

.autocomplete_selected {
    background: #adcee7;
    color: #000;
}

.popup_menu {
    background: #101010;
    border: 1px solid #202020;
        margin-top: 2px;
}

.popup_menu .popup_item {
    background: #101010;
    color: #808080;
}

.popup_menu .popup_item:hover {
    background: #202020;
    color: #fff;
}

.trow_reputation_positive {
    background: #ccffcc;
}

.trow_reputation_negative {
    background: #ffcccc;
}

.reputation_positive {
    color: green;
}

.reputation_neutral {
    color: #444;
}

.reputation_negative {
    color: red;
}

.invalid_field {
    border: 1px solid #f30;
    color: #f30;
}

.valid_field {
    border: 1px solid #0c0;
}

.validation_error {
    background: url(images/invalid.gif) no-repeat center left;
    color: #f30;
    margin: 5px 0;
    padding: 5px;
    font-weight: bold;
    font-size: 11px;
    padding-left: 22px;
}

.validation_success {
    background: url(images/valid.gif) no-repeat center left;
    color: #00b200;
    margin: 5px 0;
    padding: 5px;
    font-weight: bold;
    font-size: 11px;
    padding-left: 22px;
}

.validation_loading {
    background: url(images/spinner.gif) no-repeat center left;
    color: #555;
    margin: 5px 0;
    padding: 5px;
    font-weight: bold;
    font-size: 11px;
    padding-left: 22px;
}

/* Additional CSS (Master) */
img {
    border: none;
}

.clear {
    clear: both;
}

.hidden {
    display: none;
    float: none;
    width: 1%;
}

.hiddenrow {
    display: none;
}

.selectall {
    background-color: #FFFBD9;
    font-weight: bold;
    text-align: center;
}

.float_left {
    float: left;
}

.float_right {
    float: right;
}

.menu ul {
    list-style: none;
    margin: 0;
}

.menu li {
    display: inline;
    padding-left: 5px;
}

.menu img {
    padding-right: 5px;
    vertical-align: top;
}

#panel .links {
    margin: 0;
    float: right;
}

#panel img {
    padding-right: 5px;
    vertical-align: middle;
}

.panel-irt {
    padding-right: 5px;
    vertical-align: top;
}

.expcolimage {
    float: right;
    width: auto;
    vertical-align: middle;
    margin-top: 3px;
}

img.attachment {
    border: 1px solid #E9E5D7;
    padding: 2px;
}

hr {
    background-color: #000000;
    color: #000000;
    height: 1px;
    border: 0px;
}

#copyright {
    font: 11px Verdana, Arial, Sans-Serif;
    margin: 0;
    padding: 3px 0 0 0;
}

#debug {
    float: right;
    text-align: right;
    margin-top: 0;
}

blockquote {
    border-left: 6px solid #606060;
        -moz-box-shadow: 0px 0px 1px #101010;
        -webkit-box-shadow: 0px 0px 1px #101010;
        box-shadow: 0px 0px 1px #0098ff;
        -khtml-box-shadow: 0px 0px 1px #101010;
    margin: 0;
    background: #404040;
    padding: 5px;
        color: #fff;
}

blockquote cite {
    font-weight: bold;
    border-bottom: 1px solid #606060;
    font-style: normal;
    display: block;
    margin: 4px 0;
}

blockquote cite span {
    float: right;
    font-weight: normal;
}

blockquote cite span.highlight {
    float: none;
    font-weight: bold;
    padding-bottom: 0;
}

.codeblock {
    border-left: 6px solid #606060;
        -moz-box-shadow: 0px 0px 1px #101010;
        -webkit-box-shadow: 0px 0px 1px #101010;
        box-shadow: 0px 0px 1px #0098ff;
        -khtml-box-shadow: 0px 0px 1px #101010;
    margin: 0;
    background: #404040;
    padding: 5px;
        color: #fff;
}

.codeblock .title {
    border-bottom: 1px solid #606060;
    font-weight: bold;
    margin: 4px 0;
}

.codeblock code {
    overflow: auto;
    height: auto;
    max-height: 200px;
    display: block;
    font-family: Monaco, Consolas, Courier, monospace;
    font-size: 13px;
}

.subforumicon {
    border: 0;
        margin-right: 5px;
    vertical-align: middle;
}

.separator {
    margin: 5px;
    padding: 0;
    height: 0px;
    font-size: 1px;
    list-style-type: none;
}

form {
    margin: 0;
    padding: 0;
}

.popup_menu .popup_item_container {
    margin: 1px;
    text-align: left;
}

.popup_menu .popup_item {
    display: block;
    padding: 3px;
    text-decoration: none;
    white-space: nowrap;
}

.popup_menu a.popup_item:hover {
    text-decoration: none;
}

.autocomplete {
    text-align: left;
}

.subject_new {
    font-weight: bold;
}

.highlight {
    background: #FFFFCC;
    padding-top: 3px;
    padding-bottom: 3px;
}

.pm_alert {
    background: #FFF6BF;
    border: 1px solid #FFD324;
    text-align: center;
    padding: 5px 20px;
    margin-bottom: 15px;
    font-size: 11px;
}

.red_alert {
    background: #FBE3E4;
    border: 1px solid #A5161A;
    color: #A5161A;
    text-align: center;
    padding: 5px 20px;
    margin-bottom: 15px;
    font-size: 11px;
}

.high_warning {
    color: #CC0000;
}

.moderate_warning {
    color: #F3611B;
}

.low_warning {
    color: #AE5700;
}

div.error {
    padding: 5px 10px;
    border-top: 2px solid #FFD324;
    border-bottom: 2px solid #FFD324;
    background: #FFF6BF;
    font-size: 12px;
}

div.error p {
    margin: 0;
    color: #000;
    font-weight: normal;
}

div.error p em {
    font-style: normal;
    font-weight: bold;
    padding-left: 24px;
    display: block;
    color: #C00;
    background: url(images/error.gif) no-repeat 0;
}

div.error.ul {
    margin-left: 24px;
}

.online {
    color: #15A018;
}

.offline {
    color: #C7C7C7;
}

.pagination {
    font-size: 11px;
    padding-top: 10px;
    margin-bottom: 5px;
}

.tfoot .pagination, .tcat .pagination {
    padding-top: 0;
}
.pagination .pages {
    font-weight: bold;
}

.pagination .pagination_current, .pagination a {
    padding: 2px 6px;
    margin-bottom: 3px;
}

.pagination a {
    background: #1a1a1a url(images/darkfusion/style/trow_bg.png) top left repeat-x;
        padding: 3px 7px 4px 7px;
    color: #808080;
    border-top: 1px solid #292929;
    -moz-border-radius:2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    text-shadow: 0 -1px 0 #101010;
}

.pagination .pagination_current {
    background: #0256d8 url(images/darkfusion/style/thead_bg.png) top left repeat-x;
        padding: 4px 7px;
    color: #ffffff;
    -moz-border-radius:3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    text-shadow: 0 -1px 0 #002661;
    font-weight: bold;
}

.pagination a:hover {
    background: #1a1a1a url(images/darkfusion/style/trow_bg.png) top left repeat-x;
        padding: 3px 7px 4px 7px;
    color: #ffffff;
        border-top: 1px solid #292929;
    -moz-border-radius:3px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    text-shadow: 0 -1px 0 #101010;
}

.thread_legend, .thread_legend dd {
    margin: 0;
    padding: 0;
}

.thread_legend dd {
    padding-bottom: 4px;
    margin-right: 15px;
}

.thread_legend img {
    margin-right: 4px;
    vertical-align: bottom;
}

.forum_legend, .forum_legend dt, .forum_legend dd {
    margin: 0;
    padding: 0;
}

.forum_legend dd {
    float: left;
    margin-right: 10px;
}

.forum_legend dt {
    margin-right: 10px;
    float: left;
}

.success_message {
    color: #00b200;
    font-weight: bold;
    font-size: 10px;
    margin-bottom: 10px;
}

.error_message {
    color: #C00;
    font-weight: bold;
    font-size: 10px;
    margin-bottom: 10px;
}

.post_body {
    padding: 5px;
}

.post_content {
    padding: 5px 10px;
}

.quick_jump {
    background: url(images/jump.gif) no-repeat 0;
    width: 13px;
    height: 13px;
    padding-left: 13px; /* amount of padding needed for image to fully show */
    vertical-align: middle;
    border: none;
}

.repbox {
    font-size:16px;
    font-weight: bold;
    padding:5px 7px 5px 7px;
}

._neutral {
    background-color:#FAFAFA;
    color: #999999;
    border:1px solid #CCCCCC;
}

._minus {
    background-color: #FDD2D1;
    color: #CB0200;
    border:1px solid #980201;
}

._plus {
    background-color:#E8FCDC;
    color: #008800;
    border:1px solid #008800;
}

.pagination_breadcrumb {
    background-color: #f5f5f5;
    border: 1px solid #fff;
    outline: 1px solid #ccc;
    padding: 5px;
    margin-top: 5px;
    font-weight: normal;
}

.pagination_breadcrumb_link {
    vertical-align: middle;
    cursor: pointer;
}
        
.lastpost {
        float: left;
        text-align: left;
        margin-top: 1px;
}

fieldset {
    background-color: #303030;
        color: #fff;
        border: 1px solid #303030;
        margin: 2px;
        padding: 5px;
}

.qsearch {
    background: url(images/darkfusion/style/search_bg.png) top left no-repeat;
    height: 50px;
        width: 160x;
        float: right;
    padding: 0;
    margin: 0;
        border: none;
}

.qsearch input {
    background: transparent;
    color: #202020;
    border: none;
    float: left;
    font-size: 11px;
    font-family: trebuchet ms, arial;
    padding: 1px 5px 5px 5px;
        margin: 0;
}

.qsearch .btn:hover {
    background: url(images/darkfusion/style/search_icon.png) top left no-repeat;
        border: none;
    float: right;
    margin-left: 2px;
    margin-top: 1px;
        padding: 0;
    width: 23px;
        height: 20px;
}

.topmenu {
    padding: 9px 5px 0 5px;
background: #000;
text-align: left;
margin: auto auto;
height: 23px;
}

.topmenu a:link {
    padding: 5px 15px 5px 15px;
color: #ccc;
text-decoration: none;
}

.topmenu a:visited {
    padding: 5px 15px 5px 15px;
color: #ccc;
text-decoration: none;
}

.topmenu a:hover {
    padding: 5px 15px 0px 15px;
color: #fff;
text-decoration: underline;
}

.test {
background: #151515;
display: block;
width: 120px;
margin: 3px 3px 0px 3px;
padding: 2px 3px;
border-bottom:1px solid #2a2a2a;
-moz-border-radius: 3px;
text-align: right;
font-weight: bold;
}

Habe nach dem Abschnitt...
Code:
.menu ul a:hover, .menu ul a:active {
    background: url(images/darkfusion/style/menu_bg.png) top left repeat-x;
        width: 90px;
    padding: 9px 7px 8px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    color: #fff;
    text-decoration: none;
        text-shadow: 0 -1px 0 #202020;
}
...meinen Code eingefügt und die Werte "65px" sowie "10px" verwendet:
Code:
.menu2 {
position: relative;
margin-top: 65px;
margin-right: 10px;
text.-align: right;
}
.menu2 ul, .menu2 li {
list-style: none;
margin: 0;
padding: 0;
}
.menu2 li {
float: right;
margin-right: 5px;
}
.menu2 img {
vertical-align: bottom;
}

Solltest du bisher keine Änderungen am Theme vorgenommen haben, kannst du die kompletten Codes, die ich hier gepostet habe 1:1 verwenden.

EDIT: Solltest du Plugins installiert haben, musst du sie vorher entweder deaktiviren oder (je nach Plugin) deinstallieren.

Speichere dir aber vorher, das was du jetzt drin stehen hast! Sicher ist sicher.

Hoffe es ist soweit alles klar. Falls nicht frage vor irgendwelchen Änderungen nochmal nach.

RE: Grafik verlinken - furiify - 20.02.2012

DANKESCHÖN! Klappt perfekt! Vielen vielen Dank!

RE: Grafik verlinken - Harest - 20.02.2012

Kein Problem.
Noch eine Korrektur.

In der global.css solltest du den Abschnitt:
Code:
.menu2 img {
vertical-align: bottom;
}
gegen diesen tauschen:
Code:
.menu2 a {
vertical-align: bottom;
}
Du kannst an stelle von "bottom" auch "top" oder "middle" verwenden.

Zudem hast du vergessen den Twitterlink zu ändern.

RE: Grafik verlinken - furiify - 18.03.2012

Habe nochmal eine kurze Frage.
Und zwar möchte ich nun, dass wenn ich die Icons anklicke, auf den entsprechenden Link weitergeführt werde.
Wie mache ich das? Habe schon etwas rumprobiert, allerdings habe ich es nicht hinbekommen.
Wäre euch für eine Lösung sehr dankbar!!

RE: Grafik verlinken - Jockl - 18.03.2012

Wie Grafiken verlinkt werden steht hier ja schon geschrieben. Die Frage ist: Was meinst Du denn mit "auf den entsprechenden Link weitergeführt"?

Und was hast Du denn schon probiert?

RE: Grafik verlinken - furiify - 18.03.2012

http://scenecom.eu/board/index.php
Wenn du mal oben rechts schaust, siehst du die Icons und daneben einen Text. zB Steam.
Wenn du auf auf den "Steam"-Text klickst, kommst du auf unsere Steamseite.
Das Icon allerdings ist nicht klickbar.

Im Prinzip möchte ich, dass der Text weg ist, und man stattdessen das Icon anklicken muss um auf die Steamseite zu kommen.

E: Schon hinbekommen, dennoch danke!

RE: Grafik verlinken - Jockl - 18.03.2012

ersetze hierzu
Code:
<li><img src="[PFAD ZUM TEAMSPEAK-BILD]" alt="Teamspeak" />&nbsp;<a href="[TEAMSPEAK-LINK]">Teamspeak</a></li>
<li><img src="[PFAD ZUM STEAM-BILD]" alt="Steam" />&nbsp;<a href="[STEAM-LINK]">Steam</a></li>
<li><img src="[PFAD ZUM FACEBOOK-BILD]" alt="Facebook" />&nbsp;<a href="[FACEBOOK-LINK]">Facebook</a></li>
<li><img src="[PFAD ZUM TWITTER-BILD]" alt="Twitter" />&nbsp;<a href="[TWITTER-LINK]">Twitter</a></li>
durch
Code:
<li><a href="[TEAMSPEAK-LINK]"><img src="[PFAD ZUM TEAMSPEAK-BILD]" alt="Teamspeak" title="Teamspeak" /></a></li>
<li><a href="[STEAM-LINK]"><img src="[PFAD ZUM STEAM-BILD]" alt="Steam" title="Steam" /></a></li>
<li><a href="[FACEBOOK-LINK]"><img src="[PFAD ZUM FACEBOOK-BILD]" alt="Facebook" title="Facebook" /></a></li>
<li><a href="[TWITTER-LINK]"><img src="[PFAD ZUM TWITTER-BILD]" alt="Twitter" title="Twitter" /></a></li>


RE: Grafik verlinken - MrBrechreiz - 18.03.2012

(19.02.2012, 15:03)Falkenauge Mihawk schrieb: Wenn der Headerbanner und die Icons ein Bild sind, ist es nicht möglich. Du müsstest mit HTML die einzelnen Icons auf die richtige Stelle platzieren.

Hallo, dem muss ich da leider wiedersprechen, man kann ein Bild in mehrere Bereiche untergliedern und mit jeweiligen Links versehen. Wie es geht kann ich verraten wenn es nochmals wer braucht, denn wie ich sehe ist dies hier wohl erledigt.