Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Try Vanilla Forums Cloud product

Assets and targets

vrijvlindervrijvlinder Papillon-Sauvage MVP
edited April 2014 in Development

Hi, I have been trying to add a module in the Body of the page. I am aware of the assets possible to target a module into.

The problem is that some assets will not accept or ignore to add module in other parts.

If I add the module asset target Head, it adds it in the head not the div Id Head. Looking at the source it appears after the body tag inside the head where the meta tags are not inside the Body.

I tired adding it after the render asset handlers so it would appear after the Head. But I realize it not in the proper Head it is in the head module.

I also tried to use the Menu module as a target since it is also an asset but that did not work either. What I want is for the module to be rendered in the Body after the Head and Menu before the Content.

But Body apparently is not an asset. I can only choose Head which makes it appear at the very top of the page but it does not work. The way this plugin works now is by using jquery to prepend the Body. It is the only way I can get this to work.

The only assets that will accept modules, are Head, Content, Panel, Foot

Why not include the Body? If it is not an asset, what is it? a container of assets ?

Is there a way to target the Body ? or make it render after the Head or Menu module ?

This is one of the only plugins I have not made into a module because it needs to target the Body part before the Content and the panel....would appreciate any clues...

thanks

Comments

  • peregrineperegrine MVP
    edited April 2014

    Why not include the Body? If it is not an asset, what is it? a container of assets ?

    Body is just a div that includes the panel and content assets.

    I believe you would need to add another asset to the body. and maybe call your assset sub-body and place it above content.

     <div id="Body">
          {asset name="Mine"}
        {module name="MynewModule"}
       <div class="Row">
    

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

    vrijvlinder
  • hgtonighthgtonight ∞ · New Moderator

    Is your module just being rendered after the main content?

    If that is the case, you need to set a sort module sort order on the asset. For example, let's say you want to insert a module called 'TranslateThisModule' alway above the main content. Use the following in your /conf/config.php file:

    $Configuration['Modules']['Dashboard']['Content'] = array('TranslateThisModule', 'MessageModule', 'MeModule', 'UserBoxModule', 'ProfileOptionsModule', 'Notices', 'ActivityFilterModule', 'ProfileFilterModule', 'Content', 'Ads');
    $Configuration['Modules']['Vanilla']['Content'] = array('TranslateThisModule', 'MessageModule', 'MeModule', 'UserBoxModule', 'NewDiscussionModule', 'ProfileOptionsModule', 'Notices', 'NewConversationModule', 'NewDiscussionModule', 'DiscussionFilterModule', 'CategoryModeratorsModule', 'Content', 'Ads');
    $Configuration['Modules']['Conversations']['Content'] = array('TranslateThisModule', 'MessageModule', 'MeModule', 'UserBoxModule', 'NewConversationModule', 'Notices', 'Content', 'Ads');
    

    And you are done. Also note that there is some CSS in style.css to automatically hide sidepanel style modules in the content asset. You should have no problem coming up with the appropriate selectors. :D

    Search first

    Check out the Documentation! We are always looking for new content and pull requests.

    Click on insightful, awesome, and funny reactions to thank community volunteers for their valuable posts.

  • I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • vrijvlindervrijvlinder Papillon-Sauvage MVP

    That is kind of the way it works with jquery, it adds a div before the content where it goes.

    Then if I need to make an asset, why not make an asset instead of a module?

    Don't mistake body for Body. They are two different things.

    body is the page and Body is the div that contains the assets. There should be a way to target that div other than with jquery no?

    Or at the very least to be able to target other modules that are assets, like the Menu.

    The drawback with jquery and iframe is that you can't use relative urls. That is the only problem. And maybe the style. As a module it picks up the style of the page, but as jquery iframe the style link needs to be added.

    As a module, the slider does not function...as an iframe it works.

  • vrijvlindervrijvlinder Papillon-Sauvage MVP

    I am aware of how to move the modules with the configuration. However it does not work if I use Head as a target because the Head module is actually the head not the Head div.

    There is no way to move the menu in the sort field it seems.

    The plugin I am talking about is the VSlider.

    It is as wide as the page. It need to be rendered after the menu and the banner but before the content.

    There is no other target that wide except the Head and the Foot. But the Head is not the Head div it is the meta tags head. so It renders it in the head and makes the slider not work because in the head it causes an undefined error in the functions due to not finding the classes.

    The expand plugin work for the panel and it simply toggles open and closed so the stuff is not cluttering.

    I scoured the files looking for some way to do this. Creating a new asset sounds good but the asset also need to be targeted somewhere no?

  • hgtonighthgtonight ∞ · New Moderator

    There is no way for a module to target a non-asset part of the page without modifying the master template. You could insert a module in your theme using {module name="MyModule"}.

    If you create a new asset, as @peregrine suggested you change your modules AssetTarget() method to return the newly named asset as a string.

    Search first

    Check out the Documentation! We are always looking for new content and pull requests.

    Click on insightful, awesome, and funny reactions to thank community volunteers for their valuable posts.

  • vrijvlindervrijvlinder Papillon-Sauvage MVP

    Yes, but Menu is an asset , so it Head, but it is not the Header it is the head. The only asset in the part is the module. Looking at the class.menumodule.php it is an asset. It should be targetable.

    I looked for all the assets. The only good one for this purpose is the Foot. I guess I could target the foot and then sort the module to appear before the content, but the content is not wide enough.

    The sorting can't be done for this because each column has it's own sorting and there is nothing above it.

    ['Modules']['Vanilla']['Content'] only applies to modules in that column

    Notice there is no FootModule in the list. Because the Foot Module is a stand alone asset.

    There is effectively no way to add a module that is as wide as the FootModule but appears above the content and the panel. :'(

  • peregrineperegrine MVP
    edited April 2014

    . hmmm

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • R_JR_J Cheerleader & Troubleshooter Munich Moderator

    If I look at the standard template (of 2.1b3) I see this:

          <div id="Foot">
             <div class="Row">
                <a href="{vanillaurl}" class="PoweredByVanilla" title="Community Software by Vanilla Forums">Powered by Vanilla</a>
                {asset name="Foot"}
             </div>
          </div>
       </div>
    

    So if you do not want to let your code be inside of the div#Foot, couldn't you enclose your ToString function with </div></div>...<div><div> so that you beam yourself out of the containing asset container? That is ugly as hell, I know, and it might lead to problems with other modules or plugins that are using the footer, but it is kind of a solution.
    Your html will nevertheless be at the end of the page and you would have to take it on top with CSS but I think it is possible and when it comes to CSS I'm convinced you know how to do it.

  • vrijvlindervrijvlinder Papillon-Sauvage MVP
    edited April 2014

    I tried everything that I know of and the only sure thing is prepending to the Body div using jquery.

    The Body div is the container of the content and panel assets.

    There should be a way to target the #Body before the content and panel.
    Or the #Head div after the menu and banner.

    Adding divs to the already a div div does not help it only adds more useless code.
    I tried it. Even using that as div class="slider" id="Body" it does not make it work.

    I don't want to add it in the Foot just gave it as an example of the module that works to add something that wide to the page.

    Only two options for that module. The head or the #Foot.

    The footbox plugin works excellent as a module in the foot. it is even responsive.

    but there is no asset Body to target the slider above the content. the point of making a module is so you don't deal with adding other stuff to the master template to make it work.

    In theory I should be able to target the Menu but it won't do it. It also is an asset.
    There must be some restriction.

  • R_JR_J Cheerleader & Troubleshooter Munich Moderator
    edited April 2014

    @vrijvlinder said:
    The footboy plugin works excellent as a module in the foot. it is even responsive.

    First thing I've done when reading that was looking what the heck the Footboy plugin might be good for! lol

    vrijvlinder
  • vrijvlindervrijvlinder Papillon-Sauvage MVP
    edited April 2014

    yea the spell checker kept making it footboy lol I fixed it , it happened over and over ... maybe it is a freudian slip ... ;)

    foot•boy (ˈfʊtˌbɔɪ)

    n.
    a boy employed as a servant.

    I thought it would be some kind of foot stool...

  • hgtonighthgtonight ∞ · New Moderator
    edited April 2014

    As far as I can tell, the menu module isn't used in 2.1rc1 at all. It is used on the front end of 2.0.18.11. My simple test involved putting decho($this); in the first line of the ToString() method in /applications/dashboard/modules/class.menumodule.php and looking for output on the page.

    @vrijvlinder said:
    There should be a way to target the #Body before the content and panel.
    Or the #Head div after the menu and banner.

    There is no way to do it using the default master template. You can add those assets as you want.

    If you really want to insert content as the first child in the #Body element as a plugin, I would suggest you:

    1. Target the foot (or panel, or content where it makes sense for JS disabled users) asset for rendering
    2. Use JS to move the rendered DOM element to the #Body element
    3. Fire an event (in JS) after the move
    4. Hook into that event (rather than document.ready) to fire the 'normal' JS

    Were you looking at 2.0?

    If that is the case, you can see in /applications/dashboard/views/default.master.php that it doesn't render the 'Menu' asset, but looks for the menu module existing and then call its ToString() method. You can add content before the menu, but not after by hooking in to MenuModule_BeforeToString_Handler().

    Search first

    Check out the Documentation! We are always looking for new content and pull requests.

    Click on insightful, awesome, and funny reactions to thank community volunteers for their valuable posts.

    vrijvlinder
  • vrijvlindervrijvlinder Papillon-Sauvage MVP

    Yes , sometimes there is no better way than what works... It is ok it is not a deal breaker. I just wanted to make the slider a module and have it work the same as adding it with jquery . Which is very simple and works well for that specific thing.

  • peregrineperegrine MVP
    edited April 2014

    maybe this will help V :)

    just a joke.

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

Sign In or Register to comment.