diff --git a/pages/card/index.vue b/pages/card/index.vue
index 7a1e5acc6..bf3c14363 100755
--- a/pages/card/index.vue
+++ b/pages/card/index.vue
@@ -21,7 +21,7 @@
 
             <Card style="width: 25em">
                 <template #header>
-                    <img alt="user header" src="//demo/images/usercard.png" />
+                    <img alt="user header" src="/demo/images/usercard.png" />
                 </template>
                 <template #title> Advanced Card </template>
                 <template #subtitle> Card subtitle </template>
diff --git a/pages/galleria/GalleriaDoc.vue b/pages/galleria/GalleriaDoc.vue
index 7ae1cff43..2d766b581 100755
--- a/pages/galleria/GalleriaDoc.vue
+++ b/pages/galleria/GalleriaDoc.vue
@@ -1,5 +1,6 @@
 <template>
     <div class="content-section documentation">
+        <ClientOnly>
         <TabView>
             <TabPanel header="Documentation">
                 <h5>Import via Module</h5>
@@ -540,5 +541,6 @@ export default {
 </code></pre>
             </TabPanel>
         </TabView>
+    </ClientOnly>
     </div>
 </template>
diff --git a/pages/styleclass/StyleClassDoc.vue b/pages/styleclass/StyleClassDoc.vue
index 933e41135..e2ef1ff15 100644
--- a/pages/styleclass/StyleClassDoc.vue
+++ b/pages/styleclass/StyleClassDoc.vue
@@ -1,6 +1,8 @@
 <template>
+   
     <ClientOnly>
 <AppDoc name="StyleClassDemo" :sources="sources" github="styleclass/StyleClassDemo.vue">
+    <div>
         <h5>Import via Module</h5>
         <pre v-code.script><code>
 import StyleClass from 'primevue/styleclass';
@@ -140,8 +142,10 @@ app.directive('styleclass', StyleClass);
 
         <h5>Dependencies</h5>
         <p>None.</p>
+    </div>
     </AppDoc>
 </ClientOnly>
+
 </template>
 
 <script>
diff --git a/pages/styleclass/index.vue b/pages/styleclass/index.vue
index 6295784b8..a9f84ef19 100644
--- a/pages/styleclass/index.vue
+++ b/pages/styleclass/index.vue
@@ -1,5 +1,6 @@
 <template>
     <div>
+    <div> 
         <div class="content-section introduction">
             <div class="feature-intro">
                 <h1>StyleClass</h1>
@@ -23,6 +24,7 @@
     </div>
 
     <StyleClassDoc />
+</div>
 </template>
 
 <script>
diff --git a/plugins/primeVue.js b/plugins/primeVue.js
index 45bcde9ec..74361230c 100644
--- a/plugins/primeVue.js
+++ b/plugins/primeVue.js
@@ -101,6 +101,7 @@ import VirtualScroller from '@/components/virtualscroller/VirtualScroller';
 import AppDemoActions from '@/layouts/AppDemoActions'
 import AppDoc from '@/layouts/AppDocumentation'
 import AppInputStyleSwitch from '@/layouts/AppInputStyleSwitch'
+import DevelopmentSection from '@/layouts/DevelopmentSection'
 import CodeHighlight from '@/layouts/AppCodeHighlight';
 
 export default defineNuxtPlugin((nuxtApp) => {
@@ -212,5 +213,6 @@ nuxtApp.vueApp.component('VirtualScroller', VirtualScroller);
 
 nuxtApp.vueApp.component('AppDemoActions', AppDemoActions);
 nuxtApp.vueApp.component('AppInputStyleSwitch', AppInputStyleSwitch);
+nuxtApp.vueApp.component('DevelopmentSection', DevelopmentSection);
 nuxtApp.vueApp.component('AppDoc', AppDoc);
 }); 
\ No newline at end of file
diff --git a/service/CustomerService.js b/service/CustomerService.js
index 24ede27b9..82a028b6f 100755
--- a/service/CustomerService.js
+++ b/service/CustomerService.js
@@ -1,22 +1,22 @@
 export default class CustomerService {
 
     getCustomersSmall() {
-        return fetch('demo/data/customers-small.json').then(res => res.json())
+        return fetch('/demo/data/customers-small.json').then(res => res.json())
                 .then(d => d.data);
     }
 
     getCustomersMedium() {
-        return fetch('demo/data/customers-medium.json').then(res => res.json())
+        return fetch('/demo/data/customers-medium.json').then(res => res.json())
                 .then(d => d.data);
     }
 
     getCustomersLarge() {
-        return fetch('demo/data/customers-large.json').then(res => res.json())
+        return fetch('/demo/data/customers-large.json').then(res => res.json())
                 .then(d => d.data);
     }
 
     getCustomersXLarge() {
-        return fetch('demo/data/customers-xlarge.json').then(res => res.json())
+        return fetch('/demo/data/customers-xlarge.json').then(res => res.json())
                 .then(d => d.data);
     }
 
diff --git a/service/NodeService.js b/service/NodeService.js
index 1b1b1a0e4..32bd827f5 100755
--- a/service/NodeService.js
+++ b/service/NodeService.js
@@ -1,12 +1,12 @@
 export default class NodeService {
 
     getTreeTableNodes() {
-        return fetch('demo/data/treetablenodes.json').then(res => res.json())
+        return fetch('/demo/data/treetablenodes.json').then(res => res.json())
                 .then(d => d.root);
     }
 
     getTreeNodes() {
-        return fetch('demo/data/treenodes.json').then(res => res.json())
+        return fetch('/demo/data/treenodes.json').then(res => res.json())
                 .then(d => d.root);
     }
 }
diff --git a/service/ProductService.js b/service/ProductService.js
index dbf44e767..c0fba6263 100644
--- a/service/ProductService.js
+++ b/service/ProductService.js
@@ -1,14 +1,14 @@
 export default class ProductService {
 
     getProductsSmall() {
-		return fetch('/public/demo/data/products-small.json').then(res => res.json()).then(d => d.data);
+		return fetch('/demo/data/products-small.json').then(res => res.json()).then(d => d.data);
 	}
 
 	getProducts() {
-		return fetch('/public/demo/data/products-small.json').then(res => res.json()).then(d => d.data);
+		return fetch('/demo/data/products-small.json').then(res => res.json()).then(d => d.data);
     }
 
     getProductsWithOrdersSmall() {
-		return fetch('/public/demo/data/products-small.json').then(res => res.json()).then(d => d.data);
+		return fetch('/demo/data/products-small.json').then(res => res.json()).then(d => d.data);
 	}
 }