# How to Upload and Update Your Logo on MakeOurs Canonical page: https://makeours.com/blog/upload-logo-makeours-website Published: 2026-07-17 Your site's header is the first thing every visitor sees — and right now it might still have a placeholder where your logo should be. Here is exactly how to upload your logo through the Header section editor in MakeOurs, what file formats work best, and what to do if your logo file is not cooperating. --- Your website is live on MakeOurs — the structure is right, the copy is good, the colors feel like your brand. But the header still shows a placeholder logo or a text-only fallback. Every visitor who lands on your site sees that header first. It is the first signal that says "this is a real business." Uploading your logo on MakeOurs takes about two minutes. Finding where to do it, preparing your file, and getting it to look right in the header — that is what this guide covers, including what to do if you do not have a proper logo file yet. --- ## 1. Why Your Logo in the Header Matters The header is the one part of your site that is visible no matter which section a visitor is reading. Scroll down to services, scroll back up, jump to the contact form — the header stays in view. That makes your logo the single most repeated visual element on your entire site. A properly placed logo does three things: it identifies your business at a glance, it builds credibility, and it reinforces brand recognition. A missing logo — or a low-resolution placeholder — signals that the site is not finished, which signals that the business behind it may not be either. Spending two minutes to upload your logo is worth more than an hour spent perfecting your services section. --- ## 2. Where to Find the Logo Upload Option The logo is part of the **Header section**, managed through the sidebar in the MakeOurs builder. 1. Open your site in the builder. 2. In the left sidebar under the Content tab, look at the sections list. The **Header** is always at the very top of the list. 3. Click **Header** in the sections list. The header editor panel slides in. 4. In the header editor, scroll to the **Logo** area. You will see two fields: - **Logo Text** — a text fallback that shows if no image is uploaded - **Logo Image** — the image field for your logo file 5. In the Logo Image field, you will see an image preview area, a **Media Library** button, and a URL input field below it. This is where you upload your logo — not by clicking on the header in the preview canvas. --- ## 3. Best File Formats for Your Logo The file format affects how your logo looks in the header, especially across different background colors. **PNG with transparent background** — the best option for logos. Transparent background means your logo sits cleanly on any header color — white, dark, or colored — without a white box around it. Ask your designer for the PNG file with transparency. **SVG** — vector format, scales perfectly to any size without losing quality. If you have an SVG version of your logo, it is the highest-quality option. **JPEG** — works, but JPEGs do not support transparency. Your logo will have a rectangular background. Fine if your header background matches the logo's background color exactly, but awkward on any other color. **WebP** — supported and web-optimised, works like PNG with better compression. If you only have a JPEG with a white background and your header is white, it may look acceptable. But if you ever change the header color, you will need the PNG with transparency. Get it from your designer now. --- ## 4. Logo Sizing: What Works in the MakeOurs Header Your logo file can be large, but the header displays it at a fixed height (roughly 40–80px tall depending on your header settings). What matters is: **Recommended file dimensions:** - Width: 400–800px - Height: 100–200px - Aspect ratio: Horizontal or square logos work well. Very tall vertical logos may not display cleanly. **File size:** MakeOurs enforces a hard 1MB limit on logo uploads — anything larger is rejected with an error. Aim well under that, ideally 500KB or less. Logos do not need the same file size budget as full-width photos, and a smaller file loads faster in the header on every page. Before uploading, preview your logo at a small size — zoom out to 25% in an image viewer. If the logo text is still legible and the icon is still clear at that scale, it will look sharp in the header. If it becomes blurry or unreadable, the design may need simplification before it works at header size. --- ## 5. Step-by-Step: How to Upload Your Logo on MakeOurs 1. Open the builder for your site. 2. In the left sidebar Content tab, click **Header** at the top of the sections list. 3. In the header editor panel, scroll to the **Logo Image** field. 4. Click the **Media Library** button below the image preview area. 5. A media picker opens. Click **Upload** and choose your logo file from your device. Or, if you have already uploaded it previously, select it from the library. 6. Alternatively, paste the direct URL of your logo image into the URL input field. 7. The logo preview appears in the image preview area within the panel. 8. Add alt text in the **Alt Text** field (e.g., "Your Business Name logo") for accessibility. 9. Click the back arrow (←) to return to the sections list. 10. Click **Publish** in the top header bar to push the change live. The entire process from opening the Header panel to publishing takes under two minutes. ![MakeOurs header editor panel showing the Logo Image field with Media Library button and URL input below the preview area](https://makeours.com/images/blog/makeours-logo-header-placement.jpg) _The logo is uploaded through the Header section editor panel in the sidebar — not by clicking on the header in the preview canvas. The Media Library button lets you upload from your device._ --- ## 6. Common Logo Issues and How to Fix Them **White box around the logo:** Your logo file is a JPEG with a white background. Request a PNG with transparent background from your designer, or use a background removal tool (like remove.bg) to strip the background from the JPEG. **Logo appears tiny:** The logo file may have too much empty space around the actual artwork. Open the file in an image editor, crop tightly to the logo artwork, and re-upload. A 800×200px file where 600px of the height is empty whitespace will display as a very small logo at header height. **Logo looks blurry:** The source file resolution is too low. Upload a larger version — at minimum 400px wide. Do not scale up a small image in an image editor and re-save, as this does not improve actual quality. **Logo color clashes with header:** In the header editor panel, look for **Background** or **Header Color** settings. Change the header background to complement your logo, or get a version of your logo that works on the current header color (white logo for dark backgrounds, dark logo for light backgrounds). --- ## 7. Other Header Settings Available in the Panel While you are in the Header section editor, you will also find settings for: - **Sticky header** — toggle to keep the header visible as visitors scroll down - **Transparent background** — make the header background transparent over the hero image - **Mobile menu position** — left or right for the hamburger icon on mobile - **Navigation links** — edit the menu items (label and URL) for each nav link - **CTA button** — optional button in the header (toggle on/off, then set label, URL, and style) - **Header text color** — override the color of navigation links and logo text --- ## 8. What to Do If You Do Not Have a Logo Yet Not having a logo is not a reason to leave the header blank. Practical options: **Use your business name as text.** The Logo Text field in the header editor is already set to your site name by default. Keep it there. A clean, readable text header is better than a placeholder or a blank space. **Create a simple logo with a free tool.** Canva and similar tools let you combine an icon and your business name in about 10 minutes. Export as PNG with transparent background. **Hire a designer for a proper logo.** Platforms like Fiverr have logo designers starting at ₹800–₹1,500 for a basic business logo. For anything customer-facing long-term, a professionally designed logo is worth the cost. **Publish with the text name now, add the logo later.** There is no rush. Your site can be live with a text wordmark while you sort the logo. When you have the file ready, follow the steps in Section 5 to upload it. --- ## 9. How to Update Your Logo Later Business names, rebrands, or logo refreshes happen. To update your logo: open the builder, click Header in the sidebar, find the Logo Image field, and upload the new file. The new logo replaces the old one. Click Publish to push the change live. Check your site on both desktop and on a phone screen to confirm the updated logo looks right at both sizes. --- ## 10. Frequently Asked Questions ### Q1: Where do I upload my logo on MakeOurs? In the builder sidebar, click the **Header** section at the top of the sections list. The header editor panel opens. Scroll to the **Logo Image** field. Click **Media Library** to upload from your device, or paste a direct image URL. ### Q2: My logo looks pixelated after uploading — what went wrong? The source file resolution is too low. Upload a version that is at least 400px wide (800px or wider is better). Do not scale up a small image and re-save — that does not improve actual quality. Ask your designer for a high-resolution export. ### Q3: Can I have different logos for desktop and mobile? Not natively — the same Logo Image is used for both. This is why sizing and aspect ratio matter: your logo needs to look clear at both the desktop header scale and the smaller mobile header scale. Horizontal logos with legible text tend to work best across both sizes. ### Q4: Will uploading a new logo affect the rest of my site? No. The logo only affects the Header section. No other sections, colors, fonts, or content are changed when you update the logo. ### Q5: Can I use just my business name as text in the header instead of an image? Yes. The **Logo Text** field in the header editor sets the text displayed if no Logo Image is uploaded. If you prefer a text-only header, leave the Logo Image field empty and make sure the Logo Text field has your business name correctly spelled. --- ## 11. Conclusion: Your Logo Is the First Thing Your Brand Says Getting your logo into the MakeOurs header is a small task with outsized impact. It is the difference between a site that looks finished and one that looks like a draft. More than that, it is the one element that is always visible — every section, every scroll position, every device. Prepare your PNG file with transparent background, open the Header section in the sidebar, click Media Library to upload, and publish. Two minutes. If you do not have a logo yet, keep the text wordmark and upgrade to a logo file when you have one. **Put your brand front and center — upload your logo and publish your professional site today.** [Open the MakeOurs Editor](https://makeours.com/user/new-site) --- ### External References & Further Reading: - [Web.dev: Image format guide — PNG, JPEG, WebP, and SVG explained](https://web.dev/choose-the-right-image-format/) - [Google Search Central: Image best practices for the web](https://developers.google.com/search/docs/appearance/google-images) - [Canva Design School: How to create a simple business logo](https://www.canva.com/learn/logo-design/) _For more guides on building your MakeOurs site, visit our [Blog section](https://makeours.com/blog)._