Marketing Events Portal Series
This is part of a series on creating and customising a Marketing Events Portal using a Power Pages website. The posts are based on my own learnings and understanding of what is possible with the Event Management functionality. Each post will cover a different area of D365 Marketing as it relates to events.
*** NOTE: ALL INFORMATION IS ACCURATE AT DATE OF PUBLISHING ***

In my Events Portal series so far, we’ve looked at how an Events Overview page can be created, how to pass through values to an individual Event record to display the right details, and added a section to display any speakers that might be a part of the event. What about the person hosting the event who will do an introduction and maybe moderate questions? We might want to show their information too. In this post we will look at an an event team member to show who is hosting the event. Let’s get started!

This is our end goal, to have a nice formatted card to show the name, title and company of the host, along with their bio and photo.

Click to view in detail

The first thing is to set up your Event Team Members and add your records.

Click to view in detail

In this post I am focusing purely on internal team members who exist already in our system as a user record. You can of course include any type of team member but your queries to get the right details on to the portal page would need to be adjusted from my provided examples. In this case I am adding Walter Cricket as an internal team member and Walter is a user. I added a new value to the Role field for Event Host (it doesn’t exist out of the box) and I’ve added a description for what Walter does at our company.

Click to view in detail

As an Event Team member could be a User or a Contact, we really need a central place for their profile photo to be stored. The Event Team Member record does not have an entity image by default, but we can easily add one. Add a new column of the data type Image. Make sure the Primary image box is ticked. You can call the field whatever you like, but for consistency with other tables I’m going to call it Entity Image.

Click to view in detail

Once you’ve published your changes, you should then see an image next to the name on an Event Team Member record. You can click on the initials that are displayed.

Click to view in detail

Then browse out to find the right image and change it to update on their record.

Click to view in detail

Once you have your Event Team Members set up, each time you wish to add one to an event, just click on the Additional Information tab on the record, then click on Add Existing Event Team Member. You can then select from the list of records and save the Event. Simple!

Click to view in detail

You will need to add a Table Permission record to allow users of the portal to see the Event Team Member information. Set it as Global and Read only for the privileges. If you didn’t do it previously, make sure you have a Table Permission record for the Image Descriptor table if you want to show the entity image for the host in the portal too.

Click to view in detail

Now let’s look at what we need to do to add it to the individual Event custom Web Template. This is the same template that was created initially to display the event, and then updated to display the speakers. We need to add a new FetchXML query in to the top of the template, this time to find any Event Team Member records that are linked to the Event via a very poorly named table linking events to event team members via the Event Team Member ID. We are also making sure we return the total record count of all records found. Finally, in my case, I only want to return the Event Team Members if their role is Event Host.

{% fetchxml hosts %} 
<fetch version="1.0" output-format="xml-platform" mapping="logical" distinct="true" returntotalrecordcount='true' >
  <entity name="msevtmgt_eventteammember">
    <attribute name="msevtmgt_company" />
    <attribute name="msevtmgt_description" />
    <attribute name="msevtmgt_role" />
    <attribute name="msevtmgt_eventteammemberid" />
    <attribute name="mvw_entityimage" />
    <filter>
      <condition attribute="msevtmgt_role" operator="eq" value="916780001" />
    </filter>
<order attribute="msevtmgt_name" />
    <link-entity name="systemuser" from="systemuserid" to="msevtmgt_user" alias="user">
      <attribute name="fullname" />
      <attribute name="title" />
      <attribute name="internalemailaddress" />
    </link-entity>
    <link-entity name="msevtmgt_msevtmgt_event_msevtmgt_eventteammember" from="msevtmgt_eventteammemberid" to="msevtmgt_eventteammemberid" intersect="true">
      <filter>
        <condition attribute="msevtmgt_eventid" operator="eq" value="{{requestid}}" />
      </filter>
    </link-entity>
  </entity>
</fetch>
{% endfetchxml %} 

Then the next part you can add wherever you want to display the Host card on the page. I’ve added it underneath the description of the Event, and right above the Speakers section. As with the speakers, I first only want to display something if the count of records returned is more than 0. If not, we won’t even bother and the Event just won’t have an Event Hosts section. If there is at least one, we are then creating a grid but in the case the grid will only have 1 per row. I’m pulling in the entity image from the Event Team Member record. I am pulling in some values directly from the Event Team Member record, then others where I am going from the Event Team Member record through to their related User record and gathering things like their Full Name and Title.

For the entity image, we need to create a URL string by combining the name of the entity with the image (msevtmgt_eventteammember), the name of the attribute that holds the image (mvw_entityimage is the new custom field I created) and the id of the event team member record (msevtmgt_eventteammemberid). All of that combined will then allow us to display the image in the portal.

{% if hosts.results.total_record_count > 0 %}
   {% block hosts %}
<br><br>
<h3>Event Hosted By:</h3>
<div class="host-grid">
{% for msevtmgt_eventteammember in hosts.results.entities %}
<div class="host-item">
<div class="host-image">
<img class="hostimage_small" src="/Image/download.aspx?entity=msevtmgt_eventteammember&attribute=mvw_entityimage&id={{ msevtmgt_eventteammember.msevtmgt_eventteammemberid }}">
</div>
<div class="host-details">
<div class="host-name">{{ msevtmgt_eventteammember['user.fullname'] }}</div>
<div class="host-title">{{ msevtmgt_eventteammember['user.title'] }}</div>
<div class="host-company">{{ msevtmgt_eventteammember.msevtmgt_company }}</div>
<div class="host-bio">{{ msevtmgt_eventteammember.msevtmgt_description }}</div>
</div>
</div>
{% endfor %}      
</div>
 {% endblock %}
{% endif %}

That’s it for this one! Once you start to see the pattern of gathering the records with your FetchXML query and then building out the block section to display the data, hopefully it starts making sense and you can see how you could repeat this for other things. I’ve used a slightly different colour and gradient for the Host card compared with the Speaker cards just to differentiate between the two sections.

Click to view in detail

I’ve shared the CSS that I used for the Hosts section below so feel free to use as a starting point if it might help!

.host-content {
    font-family: 'Lato', sans-serif;
    font-size: 1.3em;
    padding-top: 1em;
}
.host-grid {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    grid-gap: 1em;
    padding: 1em 0em 4em 0em;
	width: 120%;
}
.host-item {
    box-shadow: 0 8px 10px 4px rgb(127 51 176 / 10%);
    background-color: white;
    padding: 2em;
    margin: 0em;
    border: 1px solid #dbd7d7;
    border-radius: 20px;
}
img.hostimage_small {
    border-radius: 50%;
	border: #808080 1px solid;
}
.host-image {
    width: 20%;
    float: left;
	display: flex;
    align-items: center;
    justify-content: center;
    height: 90%;
}
.host-details {
    width: 76%;
    font-size: 1.2em;
    font-family: 'Lato', sans-serif;
    float: right;
    padding: 1em 0em 0.5em 0em;
}
.host-name {
       color: #3c245c;
	   font-size: 1.5em;
}
.host-title {
       color: #838286;
    font-size: 1em;
}
.host-company {
       color: #838286;
    font-size: 1em;
}
.host-bio {
    color: #4d4d4d;
    font-size: 1em;
    padding-top: 1em;
}


Check out the latest post:
Internal Notification Emails For Event Forms In Realtime Marketing


D365 Marketing Weekly
Have you seen the D365 Marketing Weekly newsletter yet?
A weekly issue covering features, functionality and news on the topic of Marketing, specifically covering Dynamics 365 Marketing and other interesting tools and tips for anyone interested in the subject.
Subscribe Here
This is just 1 of 440 articles. You can browse through all of them by going to the main blog page, or navigate through different categories to find more content you are interested in. You can also subscribe and get new blog posts emailed to you directly.




Leave a Reply

Your email address will not be published. Required fields are marked *