Mura CMS - What options do I have for displaying body content?

Question

I'm in the process of creating some custom page layouts for my new install of Mura (I'm a Mura newbie, but we are using this at my work, so I'm learning as I go), but I'm in need of some assistance with the body of the page. Following a default layout that came with Mura, the following code is outputting the body of a page:

#$.dspBody(
body=$.content('body')
, pageTitle=pageTitle
, crumbList=0
, showMetaImage=0
)#

When an Associated Image is assigned to the page, this image shows up when I have an index of pages (a folder for example), which is great. However, it is also appearing at the top of the body when you view the page itself.

Looking at the code above, is there another property I can drop in there to remove the associated image? If so, what are my available properties here? I can't seem to find any documentation on this bit of code on the Mura sites.

As requested, the entire code for the layout in question

<cfoutput>
    <cfinclude template="inc/html_head.cfm" />
    <body id="#$.getTopID()#" class="depth-#$.content('depth')# #$.createCSSHook($.content('menuTitle'))#">
        <div class="coverImageWrapper">
            <div class="coverImage">
                <cfinclude template="inc/header.cfm" />
                <cfinclude template="inc/departmentName_socialMedia.cfm" />
                <cfinclude template="inc/topNav.cfm" />
            </div>
        </div>
        <div class="secondaryPageWrapper">
            <div class="container">
                <div class="row">
                    <div class="col-md-8 mainCol">

                        <cfinclude template="inc/breadcrumb.cfm" />
                        <cfset pageTitle = $.content('type') neq 'Page' ? $.content('title') : ''>
                        #$.dspObjects(2)#
                        #$.dspBody(
                        body=$.content('body')
                        , pageTitle=pageTitle
                        , crumbList=0
                        , showMetaImage=0
                        )#
                    </div>
                    <aside class="col-md-4 sideCol">
                        #$.dspObjects(3)#
                    </aside>
                </div>
            </div>
        </div>
        <cfinclude template="inc/department_footer.cfm" />
        <cfinclude template="inc/footer.cfm" />
        <cfinclude template="inc/html_foot.cfm" />
    </body>
</cfoutput>

We will need to see more code than that. It would also help to see a screenshot example of your issue. In that particular snippet you shared, the `showMetaImage` attribute controls displaying of the associated image or not. Having it set to `0` does not show the image. So there must be something else in your code that is showing the image. What template is assigned to your Folder page? What is contained in the `body` of that page (is the image in there)? — Miguel-F, Apr 19 '17 at 19:40
There isn't more code than this. This is straight out of a default mura page layout. This is all that is used to output the body, The image is not in the body of the document, meaning, It's not in the editable content area.The image is the first thing that appears after the page title and before the editable content. I've added all of the code in the layout. — JesseEarley, Apr 19 '17 at 19:46
Can you share a screenshot of the issue or is it page we can hit? — Miguel-F, Apr 19 '17 at 19:50
screenshot added. You're looking at the left column area.You're seeing the breadcrumb, page title, associated image and editable body content. — JesseEarley, Apr 19 '17 at 19:53
Well... I'm stumped. What happens if you take out the `#$.dspBody(...)#` code? Does the image still show? — Miguel-F, Apr 19 '17 at 19:58
It does not, removing that removes everything except the breadcrumb. — JesseEarley, Apr 19 '17 at 19:59
I wonder if the `pageTitle` is making it behave oddly. Can you try changing to this and see what happens? `#$.dspBody(body=$.content('body'), pageTitle='This is a test', crumbList=0, showMetaImage=0)#` — Miguel-F, Apr 19 '17 at 20:10

Steve Withington · Accepted Answer · 2017-04-20T15:23:42.083

3

@JesseEarley,

First of all, please check out our online Theme Developer's Guide at http://docs.getmura.com/v7/theme-developers/. I'm sure you'll find that useful.

As for your associated image issue, if you're using the latest version of Mura, and using the default theme, MuraBootstrap3, then you'll find a directory labeled content-types. Under there, you should see another directory labeled page with a file labeled index.cfm. This file is what's controlling the view of the body. Within that file, there's a section of code specifically being used to output associated images:

    <!--- Primary Associated Image --->
    <cfif $.content().hasImage(usePlaceholder=false)>
        <cfscript>
            img = $.content().getImageURL(
                size = 'carouselimage' // small, medium, large, custom, or any other pre-defined image size
                ,complete = false // set to true to include the entire URL, not just the absolute path (default)
            );
        </cfscript>
        <div class="mura-asset">
            <a class="mura-meta-image-link" href="#$.content().getImageURL()#" title="#esapiEncode('html_attr', $.content('title'))#" rel="shadowbox[body]">
                <img class-"mura-meta-image carouselimage" src="#img#" alt="#esapiEncode('html_attr', $.content('title'))#">
            </a>
        </div>
    </cfif>
<!--- /Primary Associated Image --->

That's where you can enter your custom logic, or remove it altogether, if you wish.

Clarification

The call to $.dspBody() triggers the method under requirements.mura.content.contentRenderer.cfc:dspBody(). In that method, Mura will see if you have any overrides to the rendering of the specified content type, (e.g., Page, Folder, Calendar, etc.), and there are a number of ways to override the output. For example, in your Theme's eventHandler.cfc you could have a method called onPageDefaultBodyRender() and if it returns a string, that string will be used. In similar fashion, Mura will scan for specific directories in your theme such as content_types, and if found, will then scan for content types such as page, then use the index.cfm as the rendering of the body. That's exactly what's happening in this case.

As I stated in my notes below, I'm currently working on the documentation, and will have this information in a much cleaner, and hopefully clearer, format. For now, you may want to view my presentation at http://docs.getmura.com/v7/videos/webinars/super-fast-app-dev-with-mura-7/ to get up to speed on some of this while I'm writing the new docs.

Also, as an alternative, you could either temporarily remove the content_types directory, or rename it to something else, to see how dspBody() would render your content without the override.

Cheers, Steve

edited Apr 20 '17 at 15:23

answered Apr 19 '17 at 21:37

Steve Withington

480
2
6

1

Is the `dspBody()` method not used anymore in Mura 7? – Miguel-F Apr 20 '17 at 00:22
I see the dspBody() method here: http://docs.getmura.com/v7/theme-developers/creating-layout-templates/template-variables-helper-methods/dspbody/, and it shows that setting the 'showMetaImage' to false should not show the associated image, so why does this seem to have no effect with Mura 7? – JesseEarley Apr 20 '17 at 11:11
`dspBody()` is definitely used, and actually triggers the included file. Using the `content_types/page/index.cfm` is an override technique. Some of this is covered in my presentation at http://docs.getmura.com/v7/videos/webinars/super-fast-app-dev-with-mura-7/. I'm currently working on the Mura Developer's Guide and this kind of info will be covered there in much more depth. – Steve Withington Apr 20 '17 at 15:13
1

I've just added a **clarification** to my answer. Let me know if that helps or not. – Steve Withington Apr 20 '17 at 15:25
1

Thanks @SteveWithington – Miguel-F Apr 20 '17 at 19:19
@SteveWithington - But leaving 'showMetaImage=0', and all of the code on content_types/page/index.cfm set as the default (and not having any custom logic anywhere), why does the associated image still display? Shouldn't having that set to '0' not display it at all? In fact, I can change the default 'crumbList=0' to a '1', and the breadcrumb will show up, but 'showMetaImage' with a '0' or '1' just shows the image regardless, and this is the part that I'm not understanding. – JesseEarley Apr 24 '17 at 12:44
In fact, adding metaImageSizeArgs={size='small'}" to the list of options has no effect either. It's simply displaying the carousel image via the code in the index.cfm file in the 'page' folder under 'content_types' – JesseEarley Apr 24 '17 at 13:59
I should note, I'm seeing this same behavior in the default Botostrap 3 theme using the default site. Modifying any of those properties for the meta image has no effect at all, the associated image displays in carousel size regardless. – JesseEarley Apr 24 '17 at 14:15
@JesseEarly, apparently, the **clarification** part I wrote didn't help you understand it any better. Let me put it this way, by using `content_types/page/index.cfm` it prevents portions of the call to `dspBody()` from doing what it normally does ... although, as you've discovered, the `crumbList` parameter is still used. I'm not sure what you're experience with CFML is, but maybe if you just read through the method itself, you'll see what's happening "under-the-hood" so to speak. – Steve Withington Apr 25 '17 at 13:40
@JesseEarley, Please check out the `dspBody()` method at https://github.com/blueriver/MuraCMS/blob/0e387c9454b3c085fe5e7cd876ed746ca16d5308/requirements/mura/content/contentRenderer.cfc#L1481-L1662. You'll also see a reference to `dspContentTypeBody()` which is where some other magic happens, particularly the lookup to `content_types/page/index.cfm`, etc. – Steve Withington Apr 25 '17 at 13:41
@SteveWithington, thank you. I inherited the use of Mura CMS within our organization when I took over about 6 months ago, prior to that my knowledge to CFML was non-existent. Looking through the method on github I think it makes it far more clear what each argument is doing that I'm attempting to pass it in my page layout. Previously you said that I could simply delete/rename the file located within my theme at '/content_types/page/index.cfm', and this would cause the default method to be used instead (the one linked to via github). However deleting this override causes the page to bomb out. – JesseEarley Apr 25 '17 at 15:16
@SteveWithington Doing so tells me that I'm missing an include, and it's looking specifically for that file. Is there a place that file is being referenced that I need to remove the reference for, so that the original dspBody() method (again, the one linked to via github) is used instead? – JesseEarley Apr 25 '17 at 15:20
@JesseEarley, not sure what you deleted, but if you rename the `content_types` directory to something like `old_content_types` then reload Mura, you should be able to see your pages without errors. Maybe you didn't reload Mura. – Steve Withington Apr 26 '17 at 16:10
@JesseEarley, I just ran a quick test and the only way I could replicate an error was if I deleted any part of the directory, and didn't reload Mura. – Steve Withington Apr 26 '17 at 16:12
@SteveWithington, I think that was my problem, I wasn't reloading Mura. Thank you for all the help! In the end, I think I'm going to go with the override. I've introduced some extended attributes which ultimately control the display of the associated image, so having the override in place was a good starting point! – JesseEarley Apr 26 '17 at 16:35

Mura CMS - What options do I have for displaying body content?

1 Answers1