"use strict";(self.webpackChunknewoaks_help=self.webpackChunknewoaks_help||[]).push([[2173],{523:(e,s,t)=>{t.d(s,{A:()=>n});const n=t.p+"assets/images/herobgsite-ac3cc0d0716b2ff474b8c1bd3e6eb853.png"},1407:(e,s,t)=>{t.d(s,{A:()=>n});const n=t.p+"assets/images/heroimageupload-95a7a9efbeede4b05d2a1ad1f4519f1a.png"},5816:(e,s,t)=>{t.d(s,{A:()=>n});const n=t.p+"assets/images/heroimagedescription-ade87b7b234f65745c28a3aada8b9a5f.png"},8175:(e,s,t)=>{t.d(s,{A:()=>a});t(6540);var n=t(4848);function a(){return(0,n.jsx)("code",{children:"EZsite"})}},8453:(e,s,t)=>{t.d(s,{R:()=>o,x:()=>r});var n=t(6540);const a={},i=n.createContext(a);function o(e){const s=n.useContext(i);return n.useMemo((function(){return"function"==typeof e?e(s):{...s,...e}}),[s,e])}function r(e){let s;return s=e.disableParentContext?"function"==typeof e.components?e.components(a):e.components||a:o(e.components),n.createElement(i.Provider,{value:s},e.children)}},9859:(e,s,t)=>{t.r(s),t.d(s,{assets:()=>l,contentTitle:()=>d,default:()=>p,frontMatter:()=>r,metadata:()=>n,toc:()=>c});const n=JSON.parse('{"id":"getting-started/upload-assets","title":"Upload Assets","description":"Upload Assets and Customize Your Design.","source":"@site/userGuide/getting-started/005.upload-assets.md","sourceDirName":"getting-started","slug":"/getting-started/upload-assets","permalink":"/guides/user/getting-started/upload-assets","draft":false,"unlisted":false,"tags":[],"version":"current","sidebarPosition":4,"frontMatter":{"sidebar_position":4},"sidebar":"sidebar","previous":{"title":"Set up Custom Domain","permalink":"/guides/user/getting-started/set-up-custom-domain"},"next":{"title":"Restore Versions","permalink":"/guides/user/getting-started/restore-versions"}}');var a=t(4848),i=t(8453),o=t(8175);const r={sidebar_position:4},d="Upload Assets",l={},c=[{value:"Upload Your Assets",id:"upload-your-assets",level:3},{value:"Generate Custom Visuals with AI",id:"generate-custom-visuals-with-ai",level:3},{value:"Place and Adjust Assets",id:"place-and-adjust-assets",level:3},{value:"Use Case: Uploading an Asset as a Background Image",id:"use-case-uploading-an-asset-as-a-background-image",level:2}];function u(e){const s={code:"code",h1:"h1",h2:"h2",h3:"h3",header:"header",img:"img",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,i.R)(),...e.components};return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(s.header,{children:(0,a.jsx)(s.h1,{id:"upload-assets",children:"Upload Assets"})}),"\n",(0,a.jsx)(s.p,{children:(0,a.jsx)(s.strong,{children:"Upload Assets and Customize Your Design."})}),"\n",(0,a.jsx)(s.p,{children:"You can upload and customize design assets to create a unique look for your project. Follow these steps to add and manage assets:"}),"\n",(0,a.jsx)(s.h3,{id:"upload-your-assets",children:"Upload Your Assets"}),"\n",(0,a.jsxs)(s.ul,{children:["\n",(0,a.jsx)(s.li,{children:"Add your own images, stickers, or GIFs directly to the project."}),"\n",(0,a.jsx)(s.li,{children:"Alternatively, browse professional-quality photos from Unsplash through the integrated library.### Add New Background Image via Asset Settings"}),"\n"]}),"\n",(0,a.jsx)(s.h3,{id:"generate-custom-visuals-with-ai",children:"Generate Custom Visuals with AI"}),"\n",(0,a.jsxs)(s.ul,{children:["\n",(0,a.jsx)(s.li,{children:"Enter prompts to guide the AI in generating designs tailored to your vision."}),"\n"]}),"\n",(0,a.jsx)(s.h3,{id:"place-and-adjust-assets",children:"Place and Adjust Assets"}),"\n",(0,a.jsxs)(s.ul,{children:["\n",(0,a.jsx)(s.li,{children:"Use intuitive prompts to position your assets exactly where you want them on your project."}),"\n",(0,a.jsx)(s.li,{children:"Make precise adjustments to ensure your design aligns perfectly with your goals."}),"\n"]}),"\n",(0,a.jsxs)(s.p,{children:["By combining your creativity with ",(0,a.jsx)(o.A,{}),"'s tools, you can build a fully customized design effortlessly."]}),"\n",(0,a.jsx)(s.h2,{id:"use-case-uploading-an-asset-as-a-background-image",children:"Use Case: Uploading an Asset as a Background Image"}),"\n",(0,a.jsx)(s.p,{children:(0,a.jsx)(s.strong,{children:"Step 1.  Navigate to your project\u2019s Settings > Assets > Images. Upload the background image to this folder"})}),"\n",(0,a.jsx)(s.p,{children:(0,a.jsx)(s.img,{src:t(1407).A+"",width:"1656",height:"608"})}),"\n",(0,a.jsx)(s.p,{children:"Give it a name and add a description, for example, \u201creal estate background image.\u201d"}),"\n",(0,a.jsx)(s.p,{children:(0,a.jsx)(s.img,{src:t(5816).A+"",width:"1163",height:"597"})}),"\n",(0,a.jsx)(s.p,{children:(0,a.jsx)(s.strong,{children:"Step 2. Use AI prompt to Update Background Image"})}),"\n",(0,a.jsx)(s.pre,{children:(0,a.jsx)(s.code,{children:" Update the website hero section background image with real estate background image\n"})}),"\n",(0,a.jsx)(s.p,{children:"Compared to the original background, we can confirm that the hero section background image has been successfully updated."}),"\n",(0,a.jsx)(s.p,{children:(0,a.jsx)(s.img,{src:t(523).A+"",width:"1606",height:"731"})})]})}function p(e={}){const{wrapper:s}={...(0,i.R)(),...e.components};return s?(0,a.jsx)(s,{...e,children:(0,a.jsx)(u,{...e})}):u(e)}}}]);