GETTING STARTED
Customize Your First Website
Make your first branded design changes without disturbing working site components.
Make your first branded design changes without disturbing working site components. Follow the steps below and compare each screen with the current version of your BeatKongs producer dashboard.
Step-by-step instructions
1. Open the Builder
Navigate to Website → Edit Website and select the page you want to customize.
Screenshot to replace: Builder opening on homepage. Replace the image URL with your actual BeatKongs screenshot before publishing.
2. Update a heading and text
Select the heading or paragraph on the canvas. Use the available content or typography controls to edit the text and review its appearance.
Screenshot to replace: Selected heading with text settings. Replace the image URL with your actual BeatKongs screenshot before publishing.
3. Replace a visual
Select an image and use its image settings or media picker to choose your own approved artwork. Check cropping and mobile appearance.
Screenshot to replace: Image settings and media selection. Replace the image URL with your actual BeatKongs screenshot before publishing.
Video demonstration (to be recorded)
Planned YouTube video: Customize a page in Kong Builder (2–3 minutes). Show: Open Builder, edit a heading, replace an image, check mobile, save and preview. Replace this preview image with the real BeatKongs YouTube embed once the video is ready.
4. Adjust brand colors
Use the relevant element style settings or global design controls to apply consistent colors. Avoid changing shared global settings until you understand which pages they affect.
Screenshot to replace: Color settings in Builder right panel. Replace the image URL with your actual BeatKongs screenshot before publishing.
5. Check navigation and footer
Review your header and footer using their global settings and menu controls. Confirm that links point to the correct pages.
Screenshot to replace: Global navigation and footer settings. Replace the image URL with your actual BeatKongs screenshot before publishing.
6. Review responsive views
Switch among desktop, tablet, and mobile previews. Fix overflowing text, crowded sections, or oversized images before publishing.
Screenshot to replace: Device preview controls. Replace the image URL with your actual BeatKongs screenshot before publishing.
7. Save and verify
Save your changes, open View Live Website, and test the page as a visitor.
Screenshot to replace: Save control and live website view. Replace the image URL with your actual BeatKongs screenshot before publishing.
Important: Save and inspect one section at a time to avoid accidentally changing global elements.
If something does not look right
Check that you are signed in to the correct producer account and that your plan includes the feature. Save any changes, refresh the relevant page, and compare it with the screenshots in this guide. If the problem continues, use the BeatKongs Help Center to submit a support ticket with the page name, the action you tried, the error message, and a screenshot. Never include passwords, API keys, or payment credentials.