[TYPO3-english] [Typo3 7.6] wrapper around ce-element (tx_news)

[Dave Zen]

Hi,

I want to add a <div class="wrapper"></div> around a tx_news content element.

The standard code looks like this

<div id="c...">
<h2>Header</h2>
<div class="news"> .... content is provided by the news extension, can be styled by fluid</div>
</div>

I want to wrap everyting in a div with the class wrapper, so that it looks like this:

<div class="wrapper">
<div id="c...">
<h2>Header</h2>
<div class="news"> .... content is provided by the news extension, can be styled by fluid</div>
</div>
</div>

or this (the <div id="c..."> is the outer tag in this example):

<div id="c...">
<div class="wrapper">
<h2>Header</h2>
<div class="news"> .... content is provided by the news extension, can be styled by fluid</div>
</div>
</div>

I'm not sure which is the best approach but the wrapper should be only around the ce element with the news plugin included (for now).

On top of that, I would like to wrap the <h2> tag inside another div as well, so that it looks like this:

<div id="c...">
<div class="wrapper">
<div class="header-class"><h2>Header</h2></div>
<div class="news"> .... content is provided by the news extension, can be styled by fluid</div>
</div>
</div>

I tried multiple attempts with tt_content.stdWrap and so on but nothing worked :/

Can someone help me? Is this really so difficult to accomplish?

Thank you very much.

[Vikram Mandal]

Post by Dave Zen
<div id="c...">
<div class="wrapper">
<h2>Header</h2>
<div class="news"> .... content is provided by the news extension, can
be styled by fluid</div>
</div>
</div>
I'm not sure which is the best approach but the wrapper should be only
around the ce element with the news plugin included (for now).
On top of that, I would like to wrap the <h2> tag inside another div as

You can do so by altering the news extension templates. Look inside
/typo3conf/ext/news/Resources/Private/Templates/News/

- copy the files which you want to alter to a dir inside fileadmin
- make changes
- set this new path as news template path in the TS

Vikram
--
=============================
http://T3IN.COM
FiveE Technologies.
=============================

[Dave Zen]

I tried this but it doesn't work.

the General.html (which is the start layout of the news extensions as I understand it) starts with the class="news" div-element:

<div class="news">...render code with fluid ...</div>

The <h2> comes from the content element itself and has nothing to do with the news extension plugin.

I could write <h2></h2> before the <div class="news"> tag but then I would have the header text two times in the code.

[Vikram Mandal]

I tried this but it doesn't work. code.

Try altering these :
/typo3conf/ext/news/Resources/Private/Templates/Styles/Twb/Templates/News/

Detail.html , List.html

[Dave Zen]

I used these files in that folder, copied them in another folder and styled my listview and this worked very well but I can't wrap the whole code in a <div> because the <h2> headline (from the content element input textfield) is not rendered by the tx_news fluid template files. I could make a wrapper div around the <div class="news"></div> (in the Layout/General.html) but then the <h2> would be outside of the wrapper div:

<h2>headline</h2>
<div class="wrapper">
<div class="news">

</div>
</div>

I don't want that. The <h2> from the headline field should be inside the wrapper div.
But I can't find the code where the <h2> is beeing rendered....

[Vikram Mandal]

Post by Dave Zen
I used these files in that folder, copied them in another folder and
styled my listview and this worked very well but I can't wrap the whole
code in a <div> because the <h2> headline (from the content element
input textfield) is not rendered by the tx_news fluid template files. I
could make a wrapper div around the <div class="news"></div> (in the
<h2>headline</h2>
<div class="wrapper">
<div class="news">
</div>
</div>
I don't want that. The <h2> from the headline field should be inside the wrapper div.
But I can't find the code where the <h2> is beeing rendered....

Well might be a difficult task to alter the position of the header of a
content element. You would need to find the CE templates of Typo3 and alter.

An alternative and easier way could be you can let the header be hidden
and use the header field inside your news template.

-- Vikram
=============================
http://T3IN.COM
FiveE Technologies.
=============================

[Dave Zen]

I found a solution.

The HeaderContentFooter.html file is responsible for the initial rendering of the content element.
I copied the file to my Layout folder, added a new layout option in the backend and changed my copied HeaderContentFooter.html file.
That worked.

Thank you for your help Vikram :)