How to change image dimension in RTE + typo3


Whenever we are used image in RTE that time “Image Magic” is generate new image automatically.

When adding a picture inside the RTE (Rich Text Editor) via the Insert/modify image icon it is important to choose ‘New Magic Image’ rather than ‘New Plain Image’ at the top of the popup window and then select the image. This way the image will automatically be reduced.

The “Image Magic” automatic target resize can be altered with the following TSConfig code.

RTE.default.buttons.image.options {
    # realistic magic insert sizes
    magic.maxWidth = 600
    magic.maxHeight = 600
}

If you have any queries, please do not hesitate to contact me at Jainish Senjaliya

Advertisements

How to wrap the content in RTE + typo3


wrap all the content coming from the RTE around a div tag.

Here following script will help you more for wrap your RTE content with particular div

tt_content.text.20.wrap = < div class="contentArea" >| </div >

If you have any queries, please do not hesitate to contact me at Jainish Senjaliya

How do I remove p tags in typo3 RTE text content elements


 
Many of user want to remove extra p tag which are generate automatically by TYPO3.

Following script will definitely helping you.

tt_content.stdWrap.dataWrap >
lib.parseFunc_RTE.nonTypoTagStdWrap.encapsLines >

Remove Class “bodytext” in p tag : <p class=”bodytext”>

lib.parseFunc_RTE.nonTypoTagStdWrap.encapsLines.addAttributes.P.class =

OR 

lib.parseFunc_RTE.nonTypoTagStdWrap.encapsLines.addAttributes.P.class >

Fnally you getting rid of p tag 😉

If you have any queries, please do not hesitate to contact me at Jainish Senjaliya

How to getting rid of extra markup in TYPO3


TYPO3 generate extra HTML code while we display conetent from content element.

For example:
if you put content elements on a TYPO3 page then by default the source code looks like following

<a id="c143"></a>
<div class="csc-header csc-header-n1">
  <h3 class="csc-firstHeader">This is the First Header</h3>
</div>
<p class="bodytext">This is the first paragraph</p>

This is all fine and dandy, but maybe you don’t need all of these extra classes and anchors.
Fortunately, TYPO3 core team has accomodated for that as well.

Try below code in your TypoScript template. Following should do the trick.

 lib.parseFunc_RTE.nonTypoTagStdWrap.encapsLines.addAttributes.P.class >
 lib.stdheader.stdWrap.dataWrap >
 lib.stdheader.3.headerClass >
 tt_content.stdWrap.dataWrap >

The resulting output of HTML code for the content elements will look like below.

    <h3>This is the First Header</h3>
    <p>This is the first paragraph</p>

you can also use following code to simply modify the code instead of eliminating it. For instance,

    lib.parseFunc_RTE.nonTypoTagStdWrap.encapsLines.addAttributes.P.class = my-style

will change

    <p class="bodytext">This is the first paragraph</p>

to this:

    <p class="my-style">This is the first paragraph</p>

I hope it will work for you 🙂

If you have any queries, please do not hesitate to contact me at Jainish Senjaliya

How to add custom class in RTE box + TYPO3.


 
For add your class in RTE of TYPO3 then you have to add below typoscript in you page property. ( IN TAB – Resource -> TypoScript Configuration – Page TSConfig )

You have to include your css for apply your css in RTE area.

RTE {
    default {
        contentCSS = fileadmin/templates/style/rte.css
        classesAnchor >
        classesLinks =
        showTagFreeClasses = 1       
        classesCharacter := addToList(linkBlue)
        proc.allowedClasses := addToList(linkBlue)
    }
}

It will look like in RTE (Below screen.) First you have to set your content and choose your content.. then after you can choose your block style.

RTE

If you have any query then feel free to contact me at Jainish Senjaliya