diff --git a/app/assets/javascripts/landing.js b/app/assets/javascripts/landing.js
index 5c9156f1..eb38db9d 100644
--- a/app/assets/javascripts/landing.js
+++ b/app/assets/javascripts/landing.js
@@ -140,7 +140,12 @@
       $(".page-wrapper.meetings").data('id', newId);
       $('.meeting-url').val(Meeting.getInstance().getURL());
       $('.join-meeting-title').html(I18n.join_title.replace(/%{id}/, newId));
-    })
+      if (newId === '') {
+        $('.invite-join-wrapper').addClass('hidden');
+      } else {
+        $('.invite-join-wrapper').removeClass('hidden');
+      }
+    });
 
     // enable tooltips
     var options = {
diff --git a/app/assets/javascripts/meeting.coffee b/app/assets/javascripts/meeting.coffee
index 9b13a1a4..b0a6e193 100644
--- a/app/assets/javascripts/meeting.coffee
+++ b/app/assets/javascripts/meeting.coffee
@@ -36,7 +36,7 @@ class @Meeting
     _meetingInstance = null
 
   @buildMeetingURL: (id, type) ->
-    return @buildFullDomainURL() + '/' + type + '/' + id
+    return @buildFullDomainURL() + '/' + type + '/' + encodeURIComponent(id)
 
   @buildFullDomainURL: ->
     url = location.protocol + '//' + location.hostname
diff --git a/app/views/landing/_invite_join.html.erb b/app/views/landing/_invite_join.html.erb
new file mode 100644
index 00000000..e143c74a
--- /dev/null
+++ b/app/views/landing/_invite_join.html.erb
@@ -0,0 +1,13 @@
+<div class="invite-join-wrapper hidden">
+  <div class="col-xs-6">
+    <%= render 'shared/title', title: t('invite') do %>
+      <span><%= t('invite_description') %></span>
+    <% end %>
+    <%= render 'shared/meeting_url', hidden: false %>
+  </div>
+  <div class="verticle-line"></div>
+  <div class="col-xs-6">
+    <%= render 'shared/title', title: t('join'), title_class: 'join-meeting-title' %>
+    <%= render 'shared/join_form' %>
+  </div>
+</div>
diff --git a/app/views/landing/_previously_joined.html.erb b/app/views/landing/_previously_joined.html.erb
new file mode 100644
index 00000000..3270589b
--- /dev/null
+++ b/app/views/landing/_previously_joined.html.erb
@@ -0,0 +1,6 @@
+<div class="previously-joined-wrapper hidden">
+  <div class="list-group text-center">
+    <h4><%= t('previously_joined_meetings') %></h4>
+    <ul class="previously-joined"></ul>
+  </div>
+</div>
diff --git a/app/views/landing/index.html.erb b/app/views/landing/index.html.erb
index 3bd3f593..126a4493 100644
--- a/app/views/landing/index.html.erb
+++ b/app/views/landing/index.html.erb
@@ -28,33 +28,11 @@ with BigBlueButton; if not, see <http://www.gnu.org/licenses/>.
           <%= render 'shared/meeting_name_form' %>
 
           <div class="row">
-            <div class="previously-joined-wrapper hidden">
-              <div class="list-group text-center">
-                <h4><%= t('previously_joined_meetings') %></h4>
-                <ul class="previously-joined"></ul>
-              </div>
-            </div>
+            <%= render 'landing/previously_joined' %>
           </div>
 
-          <div class="row invite-join-wrapper">
-            <div class="col-xs-6">
-              <div class="title-wrapper text-center">
-                <div class="title-invite">
-                  <h2><%= t('invite') %></h2>
-                  <span><%= t('invite_description') %></span>
-                </div>
-              </div>
-              <%= render 'shared/meeting_url', hidden: false %>
-            </div>
-            <div class="verticle-line"></div>
-            <div class="col-xs-6">
-              <div class="title-wrapper text-center">
-                <div class="title-join">
-                  <h2 class="join-meeting-title"><%= t('join') %></h2>
-                </div>
-              </div>
-              <%= render 'shared/join_form' %>
-            </div>
+          <div class="row">
+            <%= render 'landing/invite_join' %>
           </div>
 
         </div>
diff --git a/app/views/shared/_title.html.erb b/app/views/shared/_title.html.erb
new file mode 100644
index 00000000..f18a9627
--- /dev/null
+++ b/app/views/shared/_title.html.erb
@@ -0,0 +1,7 @@
+<% title_class ||= '' %>
+<div class="title-wrapper text-center">
+  <div class="title">
+    <h2 class="<%= title_class if title_class %>"><%= title %></h2>
+    <%= yield %>
+  </div>
+</div>