Skip to content

smileyface12349/wedding-website

Repository files navigation

Wedding Website

Features

  • Customisable homepage with a large selection of pre-built sections to choose from.
  • Robust theming support to change the colours and styles of individual sections. A library of pre-made themes.
  • Fully customisable RSVP form and various tools to analyse responses (including CSV export).
  • Individual accounts for all of your guests (or one account per household) so you can restrict access and collect RSVPs with confidence.
  • Fully featured admin panel to give you insights into what your guests are doing on the website and who has RSVPed.
  • Custom registry that allows items from any retailer with no fee. Individual guests claim items using their accounts.
  • Responsive interface for all screen sizes.

Coming soon:

  • Lift sharing feature (allows guests to advertise spaces in their car which other guests can then book).
  • Photos upload (TBD but very likely to be implemented).

Setup Instructions

  1. Fork this repository.
  2. Install .NET 9 SDK.
  3. Run dotnet restore.
  4. Install dotnet ef, then run dotnet ef database update (in /WeddingWebsite) to set up the database.
  5. Run the website with dotnet run Program.cs (in /WeddingWebsite). This will host your website locally.
  6. Navigate to /account/setup and make your owner account.

Once you've done these essential steps in this order, you can do some other steps:

  • Customise the website (see below).
  • Use dotnet publish and get it working on your hosting provider. You'll want to set up a service to keep it running and use a reverse proxy like Nginx.

Need Some Help?

Tech Support: If you run into trouble getting it set up or customising it, please raise a GitHub issue and I'll get back to you. If you don't have much coding experience or need more help, I'm happy to set up a call and guide you through the process. I'll be happy to offer up to 3 hours for free which should be enough to do your first-time setup and get everything up and running.

Hosting: I am happy to offer hosting on my own infrastructure for a fee. However, if you are able to get it set up on your own infrastructure then I strongly recommend opting for that option instead as if I am hosting it you will have to wait for me to review and deploy any changes to your source code.

Further Development: If there's something you want added, pitch it to me in an issue and I'll see what I think. Depending on how much I think it will benefit others I may make it for free or I may charge an hourly rate.

Pages

See what's on the website in a bit more detail

Homepage

The content shown on the demo screenshots is made up, and not based on a real wedding. The colours and backgrounds are all very easily customisable.

Sections can be added to the website in any order, using as many or as few sections as you like.

You can view this on the demo site or by expanding the section below.

View Images and Descriptions

Top Section

image

Displays a large background image and a countdown timer, with some customisable call-to-action buttons for key things that need doing currently (e.g. booking accommodation or RSVPing). This section is required at the top, unlike the rest which you may add in any order.

How We Met

image

A simple paragraph to give a bit of backstory.

Timeline

image

This unique timeline design conveys:

  • Timings of the day (with options for pop-ups including extra details about each event).
  • Travel directions (auto-generated for venue changes).
  • Accommodation details (auto-generated at the end of the timeline). All in one coherent view. I find this much easier to use than having separate sections for timings, travel directions and accommodation details.

Simple Timeline

image

If you'd rather just have a list of events and start times.

Venue Showcase

image

Shows you a little more information about the venues. Totally optional, as the important information is already in the timeline.

Travel Directions

image

The directions are already shown in other places, but you can emphasise them here too.

Accommodation

image

Gives a bit more space for the accommodation options. Totally optional, as this information is in the timeline already (but potentially less obvious).

Meet the Wedding Party

image

For a little more information about the important people. Comes with various display modes, including chat messages if you prefer that.

Gallery

image

There's a whole gallery page, but you can also choose a few to display on the homepage.

Dress Code

image

A tiny section to display the dress code. Doesn't have to be wrapped in a box.

Contacts

image

This section recommends particular people based on the type of enquiry and how urgent it is.

The Registry

The registry feature allows you to make a list of items you want, each having as many different purchase methods as you want (including transferring the money to you). Users can then claim these items and choose how they want to purchase them. This gives you no restrictions on which items you can have, although you won't get any benefits of a normal registry like free delivery.

View Image image

To-Do List

While you can use another service, it's easier to stay on the website. The to-do list allows you to co-ordinate tasks and keep track of what needs doing in one place. You can even assign guests to non-admin users, and tasks assigned to you will automatically appear on the homepage.

View Image image

Customising the Website

Configuration is done in a few separate files. All can be found in WeddingWebsite/Config. Each folder has multiple implementations of an interface, and Program.cs will determine which one is active. This lets you swap between different configurations to see what you like best.

Wedding Details

Anything that relates to your wedding in particular will go in here. Please note that if you don't include all of the sections then some of this content is not needed. This is something you need to do at some point, but you are welcome to use SampleWeddingDetails and customise the theme and layout to your liking first.

Theme and Layout

The config affects how the website displays, but not what content is within each section. There are several pre-made themes that you are welcome to choose from. The main thing you can change is which sections are present and what they look like. For each section, you can individually change the colour scheme and even what the boxes look like.

To change the config, make a new class e.g. CustomConfig that inherits from DefaultConfig and implements the IWebsiteConfig interface directly. See DemoConfig for an example.

If you're making a new feature and you're feeling generous, hide it behind a config option and then PR it so that other people can benefit from it. I will merge any PR that I think is a positive impact, but I would suggest reaching out in advance if you're not sure about it.

Credentials

Some functionality will require your own API keys. The NoCredentials interface is designed to fail gracefully, so you can safely leave this out for now and take another look later if you're interested in particular functionality.

Strings

This will allow you to change the wording, or translate the website into different languages. Note that you are currently only able to customise text that your guests can see (but feel free to implement this for admin pages in a PR!).

Interactivity

This section is only relevant if you are developing your own pages.

Show Section

In Blazor, there's several ways of making your website interactive that need to be thought about carefully.

Server-Side Rendering

Code in C#, with everything rendered on the server. Every button press triggers an HTTP request to re-render the component server-side.

  • Advantages: Fast page load, Secure, Code maintainability, Blazor libraries, Easy to enable.
  • Disadvantages: Slow interactivity, Connection required, Can be unstable.
  • Best for: Usages where a stable internet connection is likely and buttons either trigger privileged requests that would need to go to the server anyway, or are non-essential (e.g. admin page, homepage).
  • How to enable: This is the default! If it's not, write @rendermode InteractiveServer at the top of the file.

WebAssembly

Code in C#, rendering on the client. It is automatically pre-rendered on the server first.

  • Advantages: Fast (except for first load), Code maintainability, Blazor libraries.
  • Disadvantages: Nontrivial first page load time. Okay-ish support for older browsers.
  • Best for: Complex client-side logic in specific pages that require lots of interactivity (e.g. RSPV form, registry).
  • How to enable: Move the component to WeddingWebsite.Client project, then write @rendermode InteractiveWebAssembly at the top of the file.

JavaScript

Code in JavaScript directly.

  • Advantages: Fast, Reliable.
  • Disadvantages: Very poor code maintainability. No server-side pre-rendering.
  • Best for: The odd dropdown or simple component in an otherwise static page (e.g. homepage, gallery), when it feels silly to load WebAssembly for something that can be achieved with a few lines of JavaScript.
  • How to enable: Create a scoped .js file with exported functions onLoad, onUpdate and onDispose. See CountdownToDate for an example.

License

Feel free to use this for your own wedding website, that's what it's here for! You're also entirely welcome to cut bits out of it and use it in your own project without any attribution (although some attribution would be lovely). You may remove the footer at the bottom of the website if you want. Please note I have no legal obligations to provide support or ensure this product works, although I will do my best.

However, if you are planning on setting up a wedding website maker business, I've added some additional restrictions. Most notably, before reaching the payment screen, customers must be explicitly prompted about the presence of this repository and how they can set up their website for free instead. Please see the license for more information.

Please be very careful that some of the assets used in this project have special license restrictions. For example:

The following assets are used in the project and do not permit commercial use. If you want to use this code in a commercial setting, you must remove these assets, or purchase a license yourself:

The following assets are AI generated. If this is a problem, please do not use these assets:

  • Bricks background /bg/bricks.jpg
  • Blue flowers background /bg/blue-flowers.png

This list is not exhaustive, and it is your responsibility to check all assets (except source code).

About

A customisable wedding website with individual logins for guests, supporting RSVPs and a registry. Designed to be as easy as possible to hot-swap in your own wedding details, and customise the layout/theming of the site.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors