Share

Embedding A Web Page

Embedding a web page within the CRM sitemap is quite simple.  In CRM 4.0, the only caveat was that you had to make sure to add the scrollbar.  In CRM 2011, the scrollbar is in by default and really doesn’t require any further customization.

However, CRM 2011 does allow for further enhancements that can really make the look-and-feel seamless. 

To start, we’ll look at the sitemap (When you begin, I recommend uploading your web resources first). 

<Area Icon="$webresource:new_icons/example/bing32.png" Id="Dashboards" ShowGroups="false" Title="Bing">
  <Group Id="group_dashboard" IsProfile="true" Title="Bing">
    <!– Effective Example –>
    <SubArea Id="nav_dashboard" Icon="$webresource:new_icons/example/bing16.png" Url="$webresource:new_htm/example/wrapper.htm" Title="Bing Search" />
    <SubArea Id="nav_reports" Icon="$webresource:new_icons/example/iframe.png" Url="$webresource:new_htm/example/iframe.htm" Title="Internal Web App" />
  </Group>
</Area>

 

Now, I’m showing two examples

  • Linking to an internal site where you are able to change some CSS (Part 1)
  • Linking to another website where you are unable to modify the HTML (Part 2)

 

Part 1: Internal Sites

To start, this is what you are going to see if you select the internal web app.  Notice the border within the page.

image

 

Now this is quite subtle, but depending on your customizations the border can be an eye soar.  So to remove the border, we simply need to modify the CSS of our HTML file. 

<style type="text/css">

    html, body {
        border: none;
    }
</style>

image

 

This example leads to any webpage where you are able to edit the source and doesn’t require the file to be a web resource.

Part 2: Third Party Sites

Now what if you are unable to modify the web page, but want to include the site within your 2011 instance.  Luckily this is quite easy as well.  Here we can just add a wrapper file with an iFrame pointing to our desired site.  Notice the CSS is slightly different because we have to take into account for the scrollbars on both the wrapper and on the site itself.

<html>
    <head>
        <title>Bing Search</title>
        <style type="text/css">

            html, body {
                border: none;
                margin:0;
                overflow-y: hidden;
                overflow-x: hidden;               
            }
       
        </style>
    </head>
    <body>
        <iframe src='
http://www.bing.com' frameborder="0" width="100%" height="100%"></iframe>
    </body>
</html>

image

 

As you can see CRM 2011 has made it even easier to embed pages within the sitemap.  Hopefully you can add this to your environment to give your users a consistent look-and-feel.

Free Guide
On-Premises vs. Cloud CRM

A guide to help you determine the best solutions for you.