Zum Inhalt springen

Footer Menu Bilder als Link?

Erstellt am 4. Mai 2012 · 3 Antworten · letzte Antwort am 10. Mai 2012

Tags: Bilder, Frage

ginobranco ·

Hallo,
ich habe in meinem Footer Menu per TS angegeben, dass wenn für die Seite per Resscourcen ein Bild hoch geladen wird,
dies Als Hover-Bild verwendet wird.
Jetzt habe ich nur ein großes Problem!
In meinem Footer möchte ich Partner anzeigen das sind Bilder von den Firmen, klickt man drauf kommt man zur seite!
Nur ich verstecke die Seie ja im Menü dann zeigts mir aber unten das Bild nich mehr an.. 🙁
Woran liegt das?
Und alle Bilder sind total aneinander geklatscht.. kann man da auch Leerzeichen einfügen?

So schaut mein Code bis jetzt aus

     FOOTER = HMENU
     FOOTER {
       special = list
       special.value = 116,55,127,128,140
  1 = GMENU
  1.noBlur = 1
  1.wrap = |
  1.NO = 1
  1.NO.ATagTitle.field = title
  1.NO {
     altImgResource.import = uploads/media/
       altImgResource.import.field = media
     altImgResource.import.listNum = 0
      }
  1.RO < .1.NO
  1.RO = 1
  1.RO.altImgResource.import.listNum = 1
       }
    }

Danke

Chrissli ·

Wenn du die Einträge mittels HMENU ausliest, ist es doch kein Wunder wenn diese nicht
mehr angezeigt werden, nachdem du sie als Im-Menü-Versteckt markierst.

Warum benutzt du nicht einfach das CONTENT-Element, dann hast du das Problem nicht und
kannst die Einträge Rendern wie du sie brauchst ( auch mit Abständen, etc ).

FOOTER = CONTENT
FOOTER {
 table = pages
 select {
  pidInList = 116,55,127,128,140
  languageField = sys_language_uid
 }
 renderObj = COA
 renderObj {
  1 = IMAGE
  1 {
   file.import = uploads/media/
   file.import.field = media
   file.import.listNum = 0
   file.params = class="normal"
   stdWrap.typolink.parameter.field = url
  }
  2 < .1
  2 {
   file.import.listNum = 1
   file.params = class="rollover"
  }
  wrap = <div class="partner">|</div>
 }
}

Den Rollover-Effekt kannst du dann per CSS machen:

.partner IMG.rollover { display: none; }
.partner:HOVER IMG.normal { display: none; }
.partner:HOVER IMG.rollover { display: block; }

Evtl. noch ein oder zwei Anpassungen vom TS und CSS an deinen Bedürfnisse und gut ist die Laube 🙂

ginobranco ·

Vielen Dank Chrissli,

habs mal reingebaut.

Leider zeigt es mir jetzt gar nichts mehr an 🙁

Hier mal meine komplette TS

#################################
# Indexed Search aktivieren
#################################
config.index_enable = 1
 
 
# RealURL
#config.simulateStaticDocuments = 0
#config.baseURL = http://www.test-typo3.de/
#config.tx_realurl_enable = 1
#config.uniqueLinkVars = 1
#config.linkVars = L
 
#E-Mail Antispam
config.spamProtectEmailAddresses = 1
config.spamProtectEmailAddresses_atSubst = (at)
 
config {
  #Kommentare ausblenden
  disablePrefixComment = 1
  xhtml_cleaning = all
  index_enable = 1
  linkVars = L
  sys_language_uid = 0
  language = de
  locale_all = de_DE
  htmlTag_langKey = de
  metaCharset = utf-8
  #renderCharset = utf-8
  additionalHeaders = Content-Type:text/html;charset=utf-8
  extTarget=_blank
  doctype = xhtml_trans
}

plugin.tt_news {
_LOCAL_LANG.de.more = mehr...
_LOCAL_LANG.de.backToList = « Zurück zu: %s
displayList.age_stdWrap.age = Minuten| Stunden| Tage| Jahr(e)
displaySingle.age_stdWrap.age = Minuten| Stunden| Tage| Jahr(e)
}

plugin.tt_news.excludeAlreadyDisplayedNews = 0


 
#csc-header entfernen
lib.stdheader.stdWrap.dataWrap >
#�berschriften ohne Zus�tze
lib.stdheader.2.headerStyle >
lib.stdheader.3.headerClass >
# class="bodytext" bei RTE abstellen
lib.parseFunc_RTE.nonTypoTagStdWrap.encapsLines.addAttributes.P.class >
# Ummantelung mit <p> bei folgenden Tags verhindern
lib.parseFunc_RTE.nonTypoTagStdWrap.encapsLines.encapsTagList = cite, div, p, pre, hr, h1, h2, h3, h4, h5, h6,table,tr,td
#p bei Tabellenzellen entfernen
#lib.parseFunc_RTE.externalBlocks.table.stdWrap.HTMLparser.removeTags = p
#Klassen in Tabellen zulassen
lib.parseFunc_RTE.externalBlocks.table.stdWrap.HTMLparser.tags.table.fixAttrib.class.list >
 
page = PAGE
page {
 
  config.disablePrefixComment = 1
  shortcutIcon = fileadmin/template/images/favicon.ico
  typeNum = 0
  bodyTag =
 
 
  includeCSS {
   file1 = fileadmin/template/style.css
   file1.media = screen
  }
   includeJS.file10 = fileadmin/template/js/jquery.min.js
 
  includeJSFooter{
  file11 = fileadmin/template/js/animated-menu.js
  file12 = fileadmin/template/js/general.js
  file13 = fileadmin/template/js/jquery.easing.1.3.js
}


  bodyTagCObject = TEXT
  bodyTagCObject.field = uid
  bodyTagCObject.wrap = <body id="page|">
 
  10 = TEMPLATE
  10.template = FILE
  10.template.file = fileadmin/template/template.html
  10.workOnSubpart = DOKUMENT
  10.marks {
 
    LOGO = TEXT
    LOGO.value = <a href="/" title="Startseite"><img src="fileadmin/template/img/logo.png"></a>
    
  NAVI= HMENU
     NAVI {
       special = directory
       special.value = 1
       1 = TMENU
       1 {
         wrap = <ul class="sf-menu">|</ul>
         noBlur = 1
         expAll = 1
         NO = 1
         NO.before.dataWrap = <li id="pageUid_{field:uid}"> |
         NO.wrapItemAndSub = |</li>
         NO.ATagTitle.field = title // nav_title     
         ACT < .NO
         ACT = 1
         ACT.ATagParams = class="active"
       }
       2 < .1
       2 {
         noBlur = 0
       }
       3 < .2
     }
 
   CONTENT = CONTENT
     CONTENT {
       table = tt_content
       select.orderBy = sorting
       select.languageField = sys_language_uid
       select.where = colPos = 0
       renderObj < tt_content
       renderObj.stdWrap.wrap = <div id="con-mitte-left"><!--TYPO3SEARCH_begin--> | <!--TYPO3SEARCH_end--></div>
     }
 
     RIGHT = CONTENT
     RIGHT {
       table = tt_content
       slide = -1
       select.orderBy = sorting
       select.languageField = sys_language_uid
       select.where = colPos = 2
       renderObj < tt_content
       renderObj.stdWrap.wrap = <div id="con-mitte-right"> | </div>
     }
 
     HEADERBILD = CONTENT
     HEADERBILD {
       table = tt_content
       slide = -1
       select.orderBy = sorting
       select.languageField = sys_language_uid
       select.where = colPos = 1
       renderObj < tt_content
       renderObj.stdWrap.wrap = <div id="con-headerbild"> | </div>
     }
 
FOOTER = CONTENT
FOOTER {
 table = pages
 select {
  pidInList = 116,55,127,128,140
  languageField = sys_language_uid
 }
 renderObj = COA
 renderObj {
  1 = IMAGE
  1 {
   file.import = uploads/media/
   file.import.field = media
   file.import.listNum = 0
   file.params = class="normal"
   stdWrap.typolink.parameter.field = url
  }
  2 < .1
  2 {
   file.import.listNum = 1
   file.params = class="rollover"
  }
  wrap = <div class="partner">|</div>
 }
}
     HEADERNAVI = HMENU
     HEADERNAVI {
       special = list
       special.value = 104,10,138,11
  1 = GMENU
  1.noBlur = 1
  1.wrap = |
  1.NO = 1
  1.NO.ATagTitle.field = title
  1.NO {
     altImgResource.import = uploads/media/
       altImgResource.import.field = media
     altImgResource.import.listNum = 0
   
  }
  1.RO < .1.NO
  1.RO = 1
  1.RO.altImgResource.import.listNum = 1
       }
    }
 
  }
}
 
plugin.tx_indexedsearch._DEFAULT_PI_VARS.lang = 0
config.index_externals = 1 (z.B. für PDF Files)
config.sys_language_uid = 0
config.language = de
 
config.index_externals = 1
# Anzahl der anzuzeigenden Resultate pro Seite
plugin.tx_indexedsearch._DEFAULT_PI_VARS.results = 10
plugin.tx_indexedsearch {
  # ID der obersten Seite
  search.rootPidList = 1
  show.rules = 0
  show.advancedSearchLink = 1
  show.L1sections = 0
  templateFile = fileadmin/template/indexed_search.tmpl
  _DEFAULT_PI_VARS.lang = 0
  browseBoxWrap = <div class="browsebox">|</div>
  pageWrap = <span>|</span>
}



[loginUser = *]
page.10.subparts.SUBMIT2= COA_INT
page.10.subparts.SUBMIT2{

  20 = TEXT
  20.value = Logout
  20.typolink.parameter.data = TSFE:id
  20.typolink.additionalParams = &logintype=logout
  20.typolink.title = Abmelden
}
[end]


[loginUser = *]
page.10.subparts.LOGOUT = COA_INT
page.10.subparts.LOGOUT {

  10 = TEXT
  10.data = TSFE:fe_user|user|username
  10.wrap = Username:&nbsp;|<br />
  10.required = 1
  10.wrap = Sie sind eingeloggt als:&nbsp|
}
[end]


page.10.subparts.LOGIN = COA
    page.10.subparts.LOGIN {
        30 = COA
        30 {
            10 = TEXT
            10.wrap = <a href="#" id="loginButton" title = Anmelden class="h-button"><span>|</span></a>
            10.value = Login
            20 = COA
            20 {
                wrap = <div id="loginBox"> | </div>
                10 < plugin.tx_felogin_pi1
                10 {
                feloginBaseURL = xxx
                storagePid = 132
                templateFile = fileadmin/template/felogin/felogin_standard.html
                showForgotPasswordLink = 0
                noSuccessMessageAfterLogin = 0
                dateFormat = d.m.Y
 
                redirectMode = login
                #_CSS_DEFAULT_STYLE >        
 
        }    
    }    
          
 
[usergroup = *]
page.10.subparts.LOGIN < temp.logout
[else]
page.10.subparts.LOGIN < temp.login
[end]  
 
 
[globalVar = TSFE:id = 1]
page.includeJS.file81 = fileadmin/template/js/general-start.js
[global]


 
####
# Condition for layout
#####
 
[globalVar = TSFE:page|layout = 1]
page.10.template.file = fileadmin/template/template2.html
[global]
 
 
[globalVar=TSFE:page|layout=2]
page.10.template.file = fileadmin/template/temp-start.html

[global]
 
 
[browser = msie]
page.includeCSS.file90 = fileadmin/template/ie.css
[GLOBAL]

Und meine HTML

<!-- ###DOKUMENT### begin -->
<style type="text/css">
    #search {
    }
    #search input[type="text"] {
    background: url(http://localhost/typo3/fileadmin/template/img/search-white.png) no-repeat 10px 6px #fcfcfc;
    border: 1px solid #d1d1d1;
    font: bold 12px Arial,Helvetica,Sans-serif;
    color: #bebebe;
    width: 80px;
    padding: 6px 15px 6px 35px;
    text-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
    -webkit-transition: all 0.7s ease 0s;
    -moz-transition: all 0.7s ease 0s;
    -o-transition: all 0.7s ease 0s;
    transition: all 0.7s ease 0s;
    }
    #search input[type="text"]:focus {
    width: 130px;
    }
</style>
<script type="text/javascript" src="fileadmin/template/js/hoverIntent.js"></script>
<script type="text/javascript" src="fileadmin/template/js/superfish.js"></script>
<script type="text/javascript" src="fileadmin/template/js/supersubs.js"></script>
<script type="text/javascript" src="fileadmin/template/js/login.js"></script>
<script type="text/javascript">
    // initialise plugins
    $(document).ready(function(){ 
            $("ul.sf-menu").supersubs({ 
                minWidth:    11,   // minimum width of sub-menus in em units 
                maxWidth:    27,   // maximum width of sub-menus in em units 
                extraWidth:  1     // extra width can ensure lines don't sometimes turn over 
                                   // due to slight rounding differences and font-family 
            }).superfish({
    				animation:   {opacity:'toggle',height:'show',width:'show'},
    				speed: 'fast'
    			});  // call supersubs first, then superfish, so that subs are 
                             // not display:none when measuring. Call before initialising 
                             // containing tabs for same reason. 
        }); 
     
</script>
<div id="center">
        <div id="logo">###LOGO###</div>
        <div class="submit2">
            <!-- ###SUBMIT2### start -->
            <!-- ###SUBMIT2### stop -->
        </div>
        <div class="logout">
            <!-- ###LOGOUT### start -->
            <!-- ###LOGOUT### stop -->
        </div>
        <div class="login">
            <!-- ###LOGIN### start -->
            <!-- ###LOGIN### stop -->
        </div>
    <div id="head">
    </div>
    <div id="navigation">###NAVI###</div>
    <div id="headerbild">###HEADERBILD###</div>
    <div id="suchform">
        <form method="post" action="http://localhost/typo3/index.php?id=78" id="search">
            <input type="text" size="10" title="" value="" name="tx_indexedsearch[sword]" class="searchbox" placeholder="Suche..." />
            <input type="hidden" value="1" name="tx_indexedsearch[type]" />
            <input type="hidden" name="tx_indexedsearch[lang]" value="0" />
            <input type="hidden" value="1" name="no_cache" />
        </form>
    </div>
    <div style="clear:both;"></div>
    <div id="headernavi">###HEADERNAVI###</div>
    <div id="content">
        <div id="con-left-right">
            <div id="con-left">###CONTENT###</div>
            <div id="con-right">###RIGHT###</div>
        </div>
        <div id="footer">
            ###FOOTER###<br style="clear:both;" />
                    <div class="partner">
            <!-- ###PARTNER### start -->
            <!-- ###PARTNER### stop -->
        </div>
        </div>
    </div>
</div>
<!-- ###DOKUMENT### end

Ich find den Fehler einfach nicht 🙁

habe zb. bei der Seite 116 bei Ressourccen ein Bild drin..
🙁

Hast du eine Idee?
Danke

Chrissli ·

Sorry, ich hatte auf das Thema eigentlich schon geantwortet, aber habe gelegentlich das Phänomen, dass der Post dann doch nicht erscheint. Liegt vermutlich am Browser oder so,

Tatsage ist, ich habe mich bei meinem TS das ich dir gepostet habe geirrt.
Korrekt wäre das:

FOOTER = CONTENT
FOOTER {
 table = pages
 select {
  pidInList = 0
  uidInList = 116,55,127,128,140  
 }
 renderObj = COA
 renderObj {
  1 = IMAGE
  1 {
   file.import = uploads/media/
   file.import.field = media
   file.import.listNum = 0
   file.params = class="normal"
   stdWrap.typolink.parameter.field = url
  }
  2 < .1
  2 {
   file.import.listNum = 1
   file.params = class="rollover"
  }
  wrap = <div class="partner">|</div>
 }
}

Folgendes:
- languageField wird glaub' nur bei der tt_content-Table benötigt
- Die Seiten-IDs müssen natürlich mit uidInList angegeben werden ( pidInList wäre aber für die tt_content korrekt 🙂 )
- Die Query filtert Seiten mit "pid IN (x,y,z)" wobei hier die pidInList zu rate gezogen wird ( oder die id der aktuellen Seite wenn pidInList nicht angegeben wurde ). Wenn hier nur "0" angegeben wird, fällt dieser Filter weg, ich weiß allerdings nicht, ob dies so korrekt sein sollte oder es sich hier um einen kleinen Bug handelt. Im Zweifelsfall gibst du die übergeordete(n) pid(s) der gelisteten Seiten an, dann sollte das funktionieren.