How to insert HTML within the Content div

ragdoll · May 2013

I need to enclose the text of each post on my forum (http://www.fotocomefare.com/forum-fotografia) in a special div.
I see that it is added via the php command RenderAsset('Content');, so I can't simply edit the defaul-master.php.
How can I add my div in order to only enclose the post body?

hgtonight · May 2013

You can accomplish this in many ways. You could create an html override in your theme, use plugin hooks to insert an opening and closing div, create a module that outputs to the Content asset, or modify your default.master.tpl file.

If you give me some more info on what you want to do or even some html markup, I could point you in the right direction.

What version of Vanilla are you using?

peregrine · May 2013

perhaps this...

$('.Message').wrap('<div class="mynewdiv">');

hgtonight · May 2013

@peregrine said:
perhaps this...

$('.Message').wrap('<div class="mynewdiv">');

I never even thought to use JS.

peregrine · May 2013

html override in theme and the mod to default.master.tpl. I wouldn't have thought to use.

would be interesting but not crucial to list different ways of coding just for an exercise (as long as you are doing it and have the time .

Joebox · May 2013

Thanks guys. Was facing a similar issue. Will try your your methods.

ragdoll · May 2013

Thanks for the answers. I'm using Vanilla 2.0.18.4.
I have to enclose only the content of the body in the tags

The theme I'm using is a simple customization of the base theme, so the body is

<?php $this->RenderAsset('Content'); ?>

<?php $this->RenderAsset('Panel'); ?>

I'd like to be able to do it in the quickest way possible avoiding js.
@hgtonight The methods you list are described in the documentation?

businessdad · May 2013

Would you be able to extract current HTML and post how it looks, together with the desired result?

Note: to post HTML on this forum, you need to "break" the tags by adding a space after the opening angle bracket, as in < div>. If you don't the HTML will be interpreted and rendered incorrectly.

lifeisfoo · May 2013

@ragdoll Do you want to enclose the text of each user message (class .Message .Comment inside the discussion ul.Discussion) inside a div, or the entire Content?

ragdoll · May 2013

I'd like to enclose this:
< div class="Message">
Sono un appassionato di musica e assiduo frequentatore di concerti. Vorrei acquistare una reflex ( sono un principiante) e sono orientato su una Canon EOS 600D Fotocamera Reflex Digitale 18 Megapixel con Obiettivo EF-S 18-55mm IS II (venduti in kit su Amazon, prezzo conveniente mi sembra). Cosa mi potete dire? Vorrei abbinare anche questo obiettivo: Canon EF-S 55-250mm f/4-5.6 IS II Teleobiettivo con Zoom, vi sembra adatto per foto durante concerti? < /div>

With the tags < div class="aamatch Message">.

@lifeisfoo Yes, I want to enclose only the message.

businessdad · May 2013

Sorry for being picky: would you like to wrap the div, like this?

Or just add a class, like this?

peregrine · May 2013

@businessdad said:
Sorry for being picky: would you like to wrap the div, like this
Or just add a class, like this?

good point. which begs the question why??

add the class to the existing Message seems the way to go unless there is a specific reason to add another div wrapper which has nothing in it but the child div.

and adding class could be done just via modding cssclass it seems.

peregrine · May 2013

or if you want

<div class="Message">
<div class="aamatch Message">
xxx---
<p>test</p>
xxx
</div>
</div>

AddDiv plugin...

   
    <?php if (!defined('APPLICATION')) exit();
    
    $PluginInfo['AddDiV'] = array(
      
        'Name' => 'AddDiv',
        'Description' => 'AddDiv',
        'Version' => '1.0', 
       'Author' => "Peregrine"  // the author
    );
    
    class AddDivPlugin extends Gdn_Plugin {
    
    
     public function DiscussionController_AfterCommentFormat_Handler($Sender) {
     // if  (your condition)         
   $Body = $Sender->EventArguments['Object']->FormatBody;
            $Sender->EventArguments['Object']->FormatBody = "   xxx---" . $Body . " xxx ";
   
     // } 
 }
    
 
        
        public function Setup() {
            
        }
    
    }

businessdad · May 2013

@peregrine said:
or if you want

< div class="Message">
< div class="aamatch Message">
xxx---
< p>test

xxx

AddDiv plugin...

Good approach. I would just put DiscussionController_AfterCommentFormat_Handler() in theme hooks, to avoid having a plugin for such a small change.

peregrine · May 2013

Good approach. I would just put DiscussionController_AfterCommentFormat_Handler() in theme hooks, to avoid having a plugin for such a small change.

sounds reasonable...

although just as the jQuery suggestion was not good enough - I suspect this one will not be good enough either. but I thought I would throw this approach out since others besides the op might want it.

ragdoll · May 2013

Sorry, from your answers I understood that my request was wrong...

I need to add the class aamatch to the Message div. So, it must become
< div class="aamatch Message">

So, it is quite different from the original request.
Sorry for wasting so much time of yours.

hgtonight · May 2013

What are you doing the class for? If it is just being used for a JavaScript extension, it will be best if you could just change the target to the .Message class.

If you really need it for some reason, you can hook into the discussion controller and add a class through the event arguments.

public function DiscussionController_BeforeCommentDisplay_Handler($Sender) {
  $Sender-> EventArguments['CssClass'] .= ' aamatch';
}

ragdoll · May 2013

It is for an external script (I have no control of) which adds in-text advertising.
So you mean I have to change the core code?

peregrine · May 2013

add what @hgtonight to your themehooks and it will append aamatch to every discussion.

I suspect you don't want that either. You probably want to test if there is an aedvertisement and then add aamatch - if that is what you want you will need a conditional in the above. You really need to define what you want more clearly and post the result with an ad with a screenshot of the elements that show or provide a link to an exact example of what you are trying to accomplish. Also, read up on adding functions via themehooks (clue: search forum or read documention on themehooks).

businessdad · May 2013

@ragdoll said:
It is for an external script (I have no control of) which adds in-text advertising.
So you mean I have to change the core code?

As @peregrine wrote, you simply have to open the theme hooks file (there should be a file called class.hooks.php in your theme folder) and paste the code that @hgtonight gave you.

@peregrine I think that simply adding the class should do. If I understand what @ragdoll is saying, the script that adds the advertisement does it through JavaScript, and it runs only when the page is rendered in the browser. Some scripts search for keywords within text and replace them with (in my opinion, annoying) links to offers. The aamatch class is needed to tell the script where to look for the text, so that they don't alter elements such as titles and labels. Adding the class to all div.message elements should suffice (I hope).

hgtonight · May 2013

@businessdad, that is what I was thinking.

I don't like the idea of inserting a class via JS to serve some other JS. This will cause some type of race condition to which script scans first. At least I think so XD.

How to insert HTML within the Content div

Comments