ilch Forum » Ilch Clan 1.1 » Design und Templates » CSS einbinden mit JKHub Bar

Geschlossen
  1. Di. 26.07.2016 01:27 Uhr #1
    User Pic
    Draakoor Mitglied
    Registriert seit
    26.07.2016
    Beiträge
    17
    Beitragswertungen
    1 Beitragspunkte
    Hallo Leute,

    ich möchte gerne die JKHub Bar in eine Box einbinden, leider muss ich davor einen Code in die Styles.css schreiben, aber ich weis nicht wo oder in welche bei Ilch.

    Könnte da jemand helfen?

    Anleitung für die JKAHub-Bar: Klick mich

    MFG

    Draakoor


    verwendete ilch Version: 1.1 P

    betroffene Homepage: thegermanfortress.de/
    0 Mitglieder finden den Beitrag gut.
  2. Di. 26.07.2016 06:36 Uhr #2
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Letztendlich ist egal, in welche CSS Datei du es einfügst, du könntest auch eine Neue dafür erstellen.

    Am Ende muss diese im Designs eingebunden werden, dazu gibt es mehrere Wege.

    Die sinnvollste ist wohl, es in deiner Box einzubinden, dann ist es an der Stelle, womit es zusammenhängt.

    Dazu in der deiner Box, folgenden Code verwenden. 

    $ILCH_HEADER_ADDITIONS .= '<link rel="stylesheet" type="text/css" href="pfad/zur/datei.css">'


    Falls du keine neue Datei erstelle willst, kannst du es "einfach" in die include/designs/PA-Designs-RoundCorner/css/master.css des Designs einfügen.


    Zuletzt modifiziert von Mairu am 26.07.2016 - 06:38:05
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
  3. Di. 26.07.2016 11:22 Uhr #3
    User Pic
    Draakoor Mitglied
    Registriert seit
    26.07.2016
    Beiträge
    17
    Beitragswertungen
    1 Beitragspunkte
    Hab ich gemacht jetzt sieht das aber so aus:
    gesperrtes Bild

    Ich hab folgendes eingetragen: 
    $ILCH_HEADER_ADDITIONS .= '<link rel="stylesheet" type="text/css" href="http://thegermanfortress.de/include/designs/PA-Designs-RoundCorner/css/jk.css">'
<body onload="init_bar()">
<script async src="http://assets.jkhub.org/bar/jkhub_bar.js"></script>
</body>
    0 Mitglieder finden den Beitrag gut.
  4. Di. 26.07.2016 19:36 Uhr #4
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Hätte vielleicht gleich den Link aufrufen sollen.

    Da steht doch eigentlich überhaupt nur was von CSS und JS, dafür musst du doch eigentlich keine Box erstellen!?

    Das kannst du eigentlich direkt in der genannten index.htm vom Design einfügen.

    Dort gibt es sowohl den <body> als auch den </body> Tag, wo du die Verändungen durchführen kannst.
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
  5. Di. 26.07.2016 21:01 Uhr #5
    User Pic
    Draakoor Mitglied
    Registriert seit
    26.07.2016
    Beiträge
    17
    Beitragswertungen
    1 Beitragspunkte
    Wenn ich das in den Body der index.htm packe wird die Leiste garnicht angezeigt. Muss ich vielleicht dann die CSS-Datei wo anders reinpacken?
    0 Mitglieder finden den Beitrag gut.
  6. Di. 26.07.2016 22:20 Uhr #6
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Nein, die muss da auch mit rein, in den Bereich zwischen <head> und </head>.

    Und du hast auch das <body> durch <body onload="init_bar()"> ersetzt?

    Wenn das nicht geht ggf. stattdessen am Ende der vor </body> 

    <script async src="http://assets.jkhub.org/bar/jkhub_bar.js"></script>
<script>init_bar();</script>


    einfügen.
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
  7. Mi. 27.07.2016 00:13 Uhr #7
    User Pic
    Draakoor Mitglied
    Registriert seit
    26.07.2016
    Beiträge
    17
    Beitragswertungen
    1 Beitragspunkte
    Ich habs jetzt zum laufen bekommen aber, man sieht das die CSS-Datei geladen wird, der Text wird nicht unsichtbar und die Leiste verschwindet beim neuladen der Seite bzw wechslen ins Forum etc.
    0 Mitglieder finden den Beitrag gut.
  8. Mi. 27.07.2016 00:28 Uhr #8
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Eigentlich dachte ich, dass es nicht so schwer ist, das umzusetzen.

    Hier mal, wie es richtig ist. Hab die angepassten Zeilen mal markiert.

    Alternativ zu Zeile 87 könnte oder müsste in Zeile 35 
    <body onload="init_bar()">
    stehen.

    Hoffe, du hast die Anleitung der Seite nun verstanden, da steht ja direkt da, suche nach XXX und ersetze durch YYY und nicht nicht füge YYY irgendwo ein zwinker 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-loose.dtd">

<html>
<head>
	<title>{TITLE}</title>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	<link rel="stylesheet" type="text/css" href="include/designs/PA-Designs-RoundCorner/css/master.css">
	<link rel="stylesheet" type="text/css" href="include/designs/PA-Designs-RoundCorner/css/jk.css">
    <script type="text/javascript" src="include/includes/slider/js/jquery-1.9.1.min.js"></script>
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.min.js"></script>
    <script type="text/javascript" src="include/designs/PA-Designs-RoundCorner/js/jquery.reveal.js"></script>
	<script type="text/javascript" src="include/includes/slider/js/jssor.core.js"></script>
	<script type="text/javascript" src="include/includes/slider/js/jssor.utils.js"></script>
	<script type="text/javascript" src="include/includes/slider/js/jssor.slider.js"></script>
    <script type="text/javascript" src="include/designs/PA-Designs-RoundCorner/js/switchbox.js"></script>
<link rel="stylesheet" href="include/includes/slider/js/slider.css" type="text/css" />
<!-- Images Uploader -->
<link href="include/admin/weplay/css/style.css" rel="stylesheet" />
<!-- Images Uploader -->

<script type="text/javascript" src="include/includes/js/jquery.js"></script>
<script type="text/javascript" src="include/includes/js/messenger.js"></script>

<link rel="SHORTCUT ICON" href="include/images/favicon/tgf.ico">
<link type="text/css" rel="stylesheet" media="all" href="include/includes/css/messenger/chat.css" />
<link type="text/css" rel="stylesheet" media="all" href="include/includes/css/messenger/screen.css" />

<!--[if lte IE 7]>
<link type="text/css" rel="stylesheet" media="all" href="include/includes/css/messenger/screen_ie.css" />
<![endif]-->


</head>
<body>

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/de_DE/sdk.js#xfbml=1&version=v2.7";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div id="wraphead">
 <div id="headerbg"></div>
</div>
<div id="wrap">
 <div id="head"></div>
 <div id="headm">{_boxes_rc-dropdown}</div>
 <div id="lastbox">
  <div id="slider">{_boxes_pinturaslider_1.0}</div>
  <div id="rc-sbox">{_boxes_rc-sbox}</div>
  <div id="rc-sbox-button">
   <div id="rc-sbox-lfb"><a class="switchb" href="javascript:void(0);" onClick="togglesboxswitch(1);"><img src="include/designs/PA-Designs-RoundCorner/img/lfbutton.png" onmouseover="this.src='include/designs/PA-Designs-RoundCorner/img/lfbuttonh.png'" onmouseout="this.src='include/designs/PA-Designs-RoundCorner/img/lfbutton.png'" border="0"></a></div>
   <div id="rc-sbox-lnb"><a class="switchb" href="javascript:void(0);" onClick="togglesboxswitch(2);"><img src="include/designs/PA-Designs-RoundCorner/img/lnbutton.png" onmouseover="this.src='include/designs/PA-Designs-RoundCorner/img/lnbuttonh.png'" onmouseout="this.src='include/designs/PA-Designs-RoundCorner/img/lnbutton.png'" border="0"></a></div>
 </div>
 </div>
 <div id="content">
  <div id="con">
   <div id="boxm">
    {_list_menunr1@
     <div id="boxhead"><span id="menuhead">%1</span></div>
     <div id="boxmid">%2</div>
     <div id="boxfoot"></div>
    }
   </div>
   <div id="con-inhalt"><div style="width:100%;">{EXPLODE}</div></div>
  </div>
 </div>
 <div id="footer">
  <div id="footleft">{_boxes_rc-fleft}</div>
  <div id="footmid">
   <div id="f1">{_boxes_pa_weplaybox}</div>
   <div id="f2">&copy; Copyright by: <a href="http://www.pintura-arts.de">Pintura-Arts</a> | Design & Code by: <a href="http://pintura-arts.de/index.php?teams">LastChaos</a> | 
        Script by: <a href="http://www.ilch.de">Ilch</a></div>
  </div>
  <div id="footright">{_boxes_rc-fright}</div>
 </div>
</div>
<div id="rc-quick">{_boxes_rc-quick}</div>
 {_if_{SESSION_AUTHRIGHT}<='-1'}<div style=" position:fixed; right:0; top:129px; height: 55px"><a class="box" href="index.php?user-3"><img height="55" width="57" src="include/designs/PA-Designs-RoundCorner/img/quick/logout.png" onmouseover="this.src='include/designs/PA-Designs-RoundCorner/img/quick/logouth.png'" onmouseout="this.src='include/designs/PA-Designs-RoundCorner/img/quick/logout.png'" alt="Anmelden" border="0"></a></div>{/_endif}
 <div id="myModal" class="reveal-modal">{_boxes_rc-login}<a class="close-reveal-modal">&#215;</a></div>
 <div id="myModalts" class="reveal-modalts">{_boxes_rc-teamspeak}<a class="close-reveal-modal">&#215;</a></div>

<script async src="http://assets.jkhub.org/bar/jkhub_bar.js"></script>
<script>init_bar();</script>
</body>
</html>



         <!--
					{_list_DDDmenupoint@
					  <strong><big>&middot;</big></strong>
            <a %1 class="box" href="%2">%3</a>
            <br />
					}
          //-->
          
          <!-- beispiel:
            [null, '%3', '%2', '%1', null|],|,
          -->
          <!--           anfang        +     link                |ende |teilende|teilee  -->
          <!-- horizontaler menupunkt -->
          {_list_hmenupoint@<li><a target="%1" class="box" href="%2">%3</a>|</li>|<br />|</ul></li>}
          <!-- horizontaler menupunkt anfang -->
          {_list_hmenubegi@<ul>}
          <!-- horizontaler menupunkt ende -->
          {_list_hmenuende@</ul>}
          
          <!-- vertikaler menupunkt -->
          {_list_vmenupoint@<li><a target="%1" class="box" href="%2">%3</a>|</li>|<br /><ul>|</ul></li>}
          <!-- vertikaler menupunkt anfang -->
          {_list_vmenubegi@<ul>}
          <!-- vertikaler menupunkt ende -->
          {_list_vmenuende@</ul>}
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    0 Mitglieder finden den Beitrag gut.
  9. Mi. 27.07.2016 01:00 Uhr #9
    User Pic
    Draakoor Mitglied
    Registriert seit
    26.07.2016
    Beiträge
    17
    Beitragswertungen
    1 Beitragspunkte
    1:1 von dir übernommen und es geht immer noch nicht >.<
    0 Mitglieder finden den Beitrag gut.
  10. Mi. 27.07.2016 07:32 Uhr #10
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Hast du auch die Alternative getestet?

    Ansonsten lösch mal das async aus Zeile 86. Dann sollte es gehen.
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    1 Mitglieder finden den Beitrag gut.
  11. Mi. 27.07.2016 10:18 Uhr #11
    User Pic
    Draakoor Mitglied
    Registriert seit
    26.07.2016
    Beiträge
    17
    Beitragswertungen
    1 Beitragspunkte
    Danke geht jetzt.

    PS: Wäre noch toll wenn du dir das anschauen könntest.

    MFG

    Draakoor
    0 Mitglieder finden den Beitrag gut.
Geschlossen

Zurück zu Design und Templates

Optionen: Bei einer Antwort zu diesem Thema eine eMail erhalten