diff --git a/web/src/components/common/RealtimeLog.vue b/web/src/components/common/RealtimeLog.vue
index 97db87a6..f3384709 100644
--- a/web/src/components/common/RealtimeLog.vue
+++ b/web/src/components/common/RealtimeLog.vue
@@ -87,7 +87,8 @@ defineExpose({
 </script>
 
 <template>
-  <n-log ref="logRef" :log="log" trim :rows="40" :language="props.language" />
+  <n-log v-if="log" ref="logRef" :log="log" trim :rows="40" :language="props.language" />
+  <n-empty v-else :description="$gettext('No logs available')" />
 </template>
 
 <style scoped lang="scss"></style>
diff --git a/web/src/components/common/RealtimeLogModal.vue b/web/src/components/common/RealtimeLogModal.vue
index 573663dd..5033ff0f 100644
--- a/web/src/components/common/RealtimeLogModal.vue
+++ b/web/src/components/common/RealtimeLogModal.vue
@@ -77,7 +77,8 @@ defineExpose({
     @close="handleClose"
     @mask-click="handleClose"
   >
-    <n-log ref="logRef" :log="log" trim :rows="40" :language="props.language" />
+    <n-log v-if="log" ref="logRef" :log="log" trim :rows="40" :language="props.language" />
+    <n-empty v-else :description="$gettext('No logs available')" />
   </n-modal>
 </template>
 
diff --git a/web/src/views/website/EditView.vue b/web/src/views/website/EditView.vue
index 51ceb594..5e88127c 100644
--- a/web/src/views/website/EditView.vue
+++ b/web/src/views/website/EditView.vue
@@ -903,16 +903,8 @@ const updateTimeoutUnit = (proxy: any, unit: string) => {
               <n-tag>{{ setting.access_log }}</n-tag>
               {{ $gettext('view') }}.
             </n-alert>
-            <n-popconfirm @positive-click="clearLog">
-              <template #trigger>
-                <n-button type="primary">
-                  {{ $gettext('Clear Logs') }}
-                </n-button>
-              </template>
-              {{ $gettext('Are you sure you want to clear?') }}
-            </n-popconfirm>
           </n-flex>
-          <realtime-log :path="setting.access_log" language="accesslog" />
+          <realtime-log :path="setting.access_log" language="accesslog" pb-20 />
         </n-flex>
       </n-tab-pane>
       <n-tab-pane name="error_log" :tab="$gettext('Error Log')">
@@ -928,9 +920,21 @@ const updateTimeoutUnit = (proxy: any, unit: string) => {
         </n-flex>
       </n-tab-pane>
     </n-tabs>
-    <n-button v-if="current !== 'log'" type="primary" @click="handleSave">
+    <n-button
+      v-if="current !== 'log' && current !== 'error_log'"
+      type="primary"
+      @click="handleSave"
+    >
       {{ $gettext('Save') }}
     </n-button>
+    <n-popconfirm v-if="current == 'log'" @positive-click="clearLog">
+      <template #trigger>
+        <n-button type="primary">
+          {{ $gettext('Clear Logs') }}
+        </n-button>
+      </template>
+      {{ $gettext('Are you sure you want to clear?') }}
+    </n-popconfirm>
     <n-button
       v-if="current === 'https' && setting && setting.domains.length > 0"
       :loading="isObtainCert"