liknande denna kod för formulär :
<!DOCTYPE html>
<html lang="sv">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Konsultprofil Registrering</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f4f4f4;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.form-container {
background: #ffffff;
padding: 20px 30px;
border-radius: 8px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
width: 100%;
max-width: 500px;
}
h2 {
color: #3C6E71;
text-align: center;
margin-bottom: 20px;
}
label {
display: block;
margin: 10px 0 5px;
font-weight: bold;
}
input, select, textarea {
width: 100%;
padding: 10px;
margin-bottom: 15px;
border: 1px solid #ccc;
border-radius: 5px;
}
input[type="file"] {
padding: 3px;
}
button {
background-color: #3C6E71;
color: #ffffff;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
font-size: 16px;
}
button:hover {
background-color: #2B5254;
}
</style>
</head>
<body>
<div class="form-container">
<h2>Registrera Konsultprofil</h2>
<form action="/submit-konsult" method="post" enctype="multipart/form-data">
<label for="fullName">Fullständigt namn</label>
<input type="text" id="fullName" name="fullName" placeholder="Ange ditt namn" required>
<label for="email">E-post</label>
<input type="email" id="email" name="email" placeholder="Ange din e-postadress" required>
<label for="phone">Telefonnummer</label>
<input type="tel" id="phone" name="phone" placeholder="Ange ditt telefonnummer" required>
<label for="profileType">Typ av konsult</label>
<select id="profileType" name="profileType" required>
<option value="professionell">Certifierad</option>
<option value="frilansare">Frilansare</option>
</select>
<label for="categories">Välj kategori</label>
<select id="categories" name="categories" required>
<option value="bygg">Bygg</option>
<option value="inredning">Inredning</option>
<option value="trädgård">Trädgård</option>
<option value="utveckling">Utveckling</option>
<option value="företag">Företagsrådgivning</option>
</select>
<label for="experience">Erfarenhet (år)</label>
<input type="number" id="experience" name="experience" placeholder="Ange antal år av erfarenhet" required>
<label for="description">Kort beskrivning</label>
<textarea id="description" name="description" rows="4" placeholder="Beskriv dig själv och dina tjänster" required></textarea>
<label for="certifications">Certifikat (om tillgängligt)</label>
<input type="file" id="certifications" name="certifications">
<label for="profilePicture">Profilbild</label>
<input type="file" id="profilePicture" name="profilePicture" required>
<button type="submit">Registrera</button>
</form>
</div>
</body>
</html>
Formulär för Konsulter (Personen som utför uppdrag)1. Grundläggande Information
2. Profilinformation
Användarnamn/Profilnamn:[Synligt för kunder]
Profilbild(valfritt):[Ladda upp]
Titel/Expertisområde:
Certifiering eller Erfarenhet:
Plats/Ort:[Stad, region]
3. Kompetens och Tjänster
Välj konsultkategorier:
Beskrivning av dina tjänster:[Fritextfält]
Timpris eller projektbaserat pris:
4. Betalning och Avtal
Föredragen betalningsmetod:
via SLONTHGodkännande av användarvillkor och sekretesspolicy:
5. Verifiering och Synlighet
Verifiering av identitet (valfritt):
Visa min profil i följande regioner:
och denna för personliga profilen:
<!DOCTYPE html>
<html lang="sv">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Konsultprofil</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f4f4f4;
}
.profile-container {
max-width: 900px;
margin: 30px auto;
background: #ffffff;
border-radius: 8px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
padding: 20px;
}
.profile-header {
display: flex;
align-items: center;
margin-bottom: 20px;
}
.profile-picture {
width: 120px;
height: 120px;
border-radius: 50%;
overflow: hidden;
margin-right: 20px;
}
.profile-picture img {
width: 100%;
height: 100%;
object-fit: cover;
}
.profile-info {
flex-grow: 1;
}
.profile-info h2 {
margin: 0;
color: #3C6E71;
}
.profile-info p {
margin: 5px 0;
color: #555;
}
.section {
margin-bottom: 20px;
}
.section h3 {
color: #3C6E71;
border-bottom: 2px solid #3C6E71;
display: inline-block;
padding-bottom: 5px;
margin-bottom: 10px;
}
.button {
display: inline-block;
background-color: #3C6E71;
color: white;
padding: 10px 20px;
border-radius: 5px;
text-decoration: none;
text-align: center;
}
.button:hover {
background-color: #2B5254;
}
</style>
</head>
<body>
<div class="profile-container">
<!-- Profilhuvud -->
<div class="profile-header">
<div class="profile-picture">
<img src="placeholder.jpg" alt="Profilbild">
</div>
<div class="profile-info">
<h2>Maria Svensson</h2>
<p>Konsult inom Bygg och Inredning</p>
<p>Erfarenhet: 8 år</p>
<p>Plats: Stockholm, Sverige</p>
</div>
</div>
<!-- Beskrivning -->
<div class="section">
<h3>Om mig</h3>
<p>Jag är en passionerad konsult med bred erfarenhet av byggprojekt och inredningsdesign. Jag hjälper mina kunder att förverkliga sina idéer genom att erbjuda praktiska lösningar och detaljerade rekommendationer.</p>
</div>
<!-- Certifikat -->
<div class="section">
<h3>Certifikat</h3>
<ul>
<li>Certifierad byggingenjör (2020)</li>
<li>Diplom i inredningsdesign (2018)</li>
</ul>
</div>
<!-- Kontaktinformation -->
<div class="section">
<h3>Kontakt</h3>
<p>Email: maria.svensson@example.com</p>
<p>Telefon: 070-123 45 67</p>
<a href="mailto:maria.svensson@example.com" class="button">Kontakta mig</a>
</div>
<!-- Galleri -->
<div class="section">
<h3>Projektgalleri</h3>
<p>Här är några av mina tidigare projekt:</p>
<div style="display: flex; gap: 10px;">
<img src="projekt1.jpg" alt="Projekt 1" style="width: 150px; height: 100px; object-fit: cover;">
<img src="projekt2.jpg" alt="Projekt 2" style="width: 150px; height: 100px; object-fit: cover;">
<img src="projekt3.jpg" alt="Projekt 3" style="width: 150px; height: 100px; object-fit: cover;">
</div>
</div>
</div>
</body>
</html>