Mura CMS: How to enable editable components in Mura 7 similar to how they worked in Mura 6.

component_index.cfm

<!---
    NOTE: 
    In Mura 6, using '$.dspObject(object='component', objectid='Some Component')' in a layout template 
    would generate a pencil icon for content manager to edit the component from the front-end view of the site.
      
    In Mura 7, we have migrated to using a layout manager for front-end edits. However, this old functionality no longer works.
    So, here's a workaround to accomplish something very similar to the functionality in Mura 6.

    1. Under your theme, create a directory labeled 'content_types' if it doesn't already exist
    2. Under the 'content_types' directory, create another directory labeled 'component'
    3. In the 'component' directory, create a file called 'index.cfm'
    4. Copy and paste this code into the 'index.cfm' file
    5. Reload Mura
--->

<cfoutput>
  #m.setDynamicContent(m.component('body'))#

  <!--- Show Edit button if allowed access to components module, and then verify they have access to 'this' specfic component --->
  <cfif m.getBean('permUtility').getModulePerm('00000000000000000000000000000000003',m.component('siteid')) and listFindNoCase('author,editor',m.getBean('permUtility').setRestriction(m.component().getCrumbArray()).perm)>
    <a class="btn btn-primary" onclick="return Mura.initFrontendUI(this);" href="#m.siteConfig('adminpath')#/?muraAction=cArch.editLive&contentId=#m.component('contentid')#&type=Component&siteId=#esapiEncode('html_attr', m.component('siteid'))#&instanceid=#esapiEncode('html_attr', objectparams.instanceid)#&compactDisplay=true">
      Edit
    </a>
  </cfif>
</cfoutput>