diff --git a/addons/website_slides/static/src/js/slides_upload.js b/addons/website_slides/static/src/js/slides_upload.js
index cdb37ff47cd..30901d80640 100644
--- a/addons/website_slides/static/src/js/slides_upload.js
+++ b/addons/website_slides/static/src/js/slides_upload.js
@@ -144,6 +144,11 @@ var SlideUploadDialog = Dialog.extend({
                 'mime_type': this.file.type,
                 'datas': this.file.data
             });
+        } else if (values['slide_type'] === 'webpage') {
+            _.extend(values, {
+                'mime_type': 'text/html',
+                'image': this.file.type === 'image/svg+xml' ? this._svgToPng() : this.file.data,
+            });
         } else if (/^image\/.*/.test(this.file.type)) {
             _.extend(values, {
                 'slide_type': 'infographic',
@@ -347,9 +352,12 @@ var SlideUploadDialog = Dialog.extend({
         }
     },
     _onChangeSlideUpload: function (ev) {
+        var self = this;
         this._alertRemove();
 
-        var self = this;
+        var $input = $(ev.currentTarget);
+        var preventOnchange = $input.data('preventOnchange');
+
         var file = ev.target.files[0];
         var isImage = /^image\/.*/.test(file.type);
         var loaded = false;
@@ -440,9 +448,11 @@ var SlideUploadDialog = Dialog.extend({
             };
         }
 
-        var input = file.name;
-        var inputVal = input.substr(0, input.lastIndexOf('.')) || input;
-        this._formSetFieldValue('name', inputVal);
+        if (!preventOnchange) {
+            var input = file.name;
+            var inputVal = input.substr(0, input.lastIndexOf('.')) || input;
+            this._formSetFieldValue('name', inputVal);
+        }
     },
     _onChangeSlideUrl: function (ev) {
         var self = this;
diff --git a/addons/website_slides/static/src/xml/website_slides_upload.xml b/addons/website_slides/static/src/xml/website_slides_upload.xml
index b427446e28f..966ff3362cd 100644
--- a/addons/website_slides/static/src/xml/website_slides_upload.xml
+++ b/addons/website_slides/static/src/xml/website_slides_upload.xml
@@ -103,6 +103,26 @@
         <div>
             <form class="clearfix">
                 <t t-call="website.slide.upload.modal.common"/>
+                <div class="form-group row">
+                    <div class="col-md-4">
+                        <div class="img-thumbnail">
+                            <div class="o_slide_preview">
+                                <img src="/website_slides/static/src/img/document.png" id="slide-image" title="Content Preview" alt="Content Preview" class="img-fluid"/>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="col-md-8">
+                        <ul class="list-group">
+                            <li class="list-group-item">
+                                <h5 class="list-group-item-heading">
+                                    <label for="upload" class="col-form-label">Cover Image File</label>
+                                </h5>
+                                <input id="upload" name="file" class="form-control" accept="image/*" type="file" required="required" data-prevent-onchange="1"/>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+                <canvas id="data_canvas" class="d-none"></canvas>
             </form>
         </div>
     </t>
diff --git a/addons/website_slides/views/slide_slide_views.xml b/addons/website_slides/views/slide_slide_views.xml
index 180a525488e..33301591189 100644
--- a/addons/website_slides/views/slide_slide_views.xml
+++ b/addons/website_slides/views/slide_slide_views.xml
@@ -46,7 +46,7 @@
                                 <field name="active" widget="boolean_button" options='{"terminology": "archive"}'/>
                             </button>
                         </div>
-                        <field name="image" widget="image" class="oe_avatar" options='{"preview_image": "image_thumb"}' readonly="1"/>
+                        <field name="image" widget="image" class="oe_avatar" options='{"preview_image": "image_thumb"}' attrs="{'required': [('slide_type', 'not in', ('document'))], 'readonly': [('slide_type', 'in', ('document', 'presentation', 'video'))]}"/>
                         <div class="oe_title">
                             <div class="oe_edit_only">
                                 <label for="name" string="Name"/>
@@ -68,8 +68,8 @@
                             </page>
                             <page string="Document">
                                 <group>
-                                    <field name="url" attrs="{'required': [('image', '=', False)]}"/>
                                     <field name="slide_type" readonly="1"/>
+                                    <field name="url" attrs="{'required': [('slide_type', 'in', ('document', 'video'))], 'readonly': [('slide_type', 'in', ('document', 'video'))]}"/>
                                     <field name="document_id" readonly="1" attrs="{'invisible': [('document_id', '=', False)]}"/>
                                     <field name="mime_type" readonly="1"/>
                                     <field name="datas" readonly="1"/>