Honden BEHEER
Alle honden staan in de webshop. Foto's in eerste instantie lokaal opslaan en gelijk bij het aanmaken van een nieuwe hond, ook een GEADOPTEERD en GERESERVEERD profielfoto maken.
Oude HTML-codes etc. NIET GEBRUIKEN
🐾 Lucky Dogs Rescue: Hond Code Generator
Vul hieronder de gegevens van de nieuwe hond in. Klik daarna op de knop om de HTML-code te genereren die je op de live hondenpagina kunt plakken.
🎉 Code succesvol gegenereerd! Kopieer de tekst hieronder en plak deze op de openbare hondenpagina in JouwWeb:
Tip: Klik in het tekstvak om alle code direct te selecteren.
Uitgebreid veld Duo generator
🐾 Lucky Dogs Rescue: Visuele Duo Generator
Vul hieronder de algemene filters in en typ de specifieke gegevens direct in de tabellen. Klik daarna op de knop om de HTML-codes te genereren.
✍️ Typ hieronder direct de profielgegevens in:
| 🏠 Thuissituatie & Algemeen | |
|---|---|
| Algemeen |
•
•
•
|
| Kinderen | |
| Katten / Honden | |
| Alleen zijn | |
| Trappen lopen | |
| Tuin of erf | |
| 🐾 Karakter & Gezondheid | |
|---|---|
| Karakter | |
| Beweging & Spel | |
| Omgang vreemden | |
| Medisch & Gedrag | |
| Extra's | |
🎉 Codes succesvol gegenereerd!
1. Code voor de OVERZICHTSPAGINA (Plakken in de grote lijst):
2. Code voor de EIGEN PROFIELPAGINA van de hond (De tabellen):
Nieuwe honden toevoegen
Maak eerst een aparte pagina aan voor een nieuwe hond, daarna onderstaande uitleg volgen.
Nog niet verwijderen!
Dit is de laatste code en deze vervangt de code hier direct boven.
🐾 Lucky Dogs Rescue: Visuele Duo Generator
Vul hieronder de algemene filters in en typ de specifieke gegevens direct in de tabellen. Klik daarna op de knop om de HTML-codes te genereren.
✍️ Typ hieronder direct de profielgegevens in:
| 🏠 Thuissituatie & Algemeen | |
|---|---|
| Algemeen |
•
•
•
|
| Kinderen | |
| Katten / Honden | |
| Alleen zijn | |
| Trappen lopen | |
| Tuin of erf | |
| 🐾 Karakter & Gezondheid | |
|---|---|
| Karakter | |
| Beweging & Spel | |
| Omgang vreemden | |
| Medisch & Gedrag | |
| Extra's | |
🎉 Codes succesvol gegenereerd!
1. Code voor de OVERZICHTSPAGINA (Plakken in de grote lijst):
2. Code voor de EIGEN PROFIELPAGINA van de hond (De tabellen):
Een deel is zichtbaar.
Om te zien wat er staat voer je bovenstaande code in een html editor in, bijvoorbeeld deze:
https://www.w3schools.com/html/tryit.asp?filename=tryhtml_editor
Je krijgt dan zoiets te zien. Dit kun je helemaal invullen met alle informatie die je hebt.
Uitleg bovengenoemd veld.
Scroll naar beneden.
Deze codes heb je nodig
https://www.w3schools.com/html/tryit.asp?filename=tryhtml_editor
LICHTKRANT - onderstaande code in Embed code veld plaatsen
<a href="/storm" class="lichtkrant-container-link" title="Bekijk het profiel van Storm">
<div class="lichtkrant-scroll">
<span class="lichtkrant-item">
🔥 <strong>SPOEDADOPTIE:</strong> Dringend een gastgezin of definitief thuis gezocht! <strong>Storm</strong> hij is op zoek naar rust, vertrouwen en een gouden mandje <span class="lichtkrant-btn">Bekijk haar profiel →</span>
</span>
<span class="lichtkrant-item">
🔥 <strong>SPOEDADOPTIE:</strong> Dringend een gastgezin of definitief thuis gezocht! <strong>Storm</strong> hij is op zoek naar rust, vertrouwen en een gouden mandje <span class="lichtkrant-btn">Bekijk haar profiel →</span>
</span>
</div>
</a>
<style>
.lichtkrant-container-link {
display: block;
width: 100%;
background-color: #d9534f; /* De opvallende rode kleur */
color: white !important; /* Forceert witte tekst, ook al is het een link */
white-space: nowrap;
overflow: hidden;
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
font-family: sans-serif;
padding: 12px 0;
margin: 15px 0;
border-radius: 4px;
text-decoration: none !important; /* Haalt de standaard onderstreping van links weg */
cursor: pointer;
}
.lichtkrant-scroll {
display: flex;
width: max-content;
animation: scroll-lichtkrant 20s linear infinite;
}
/* Pauzeer de lichtkrant en geef een subtiele hover-kleur als je eroverheen gaat */
.lichtkrant-container-link:hover {
background-color: #c9302c; /* Iets donkerder rood bij hover */
}
.lichtkrant-container-link:hover .lichtkrant-scroll {
animation-play-state: paused;
}
.lichtkrant-item {
display: inline-block;
font-size: 15px;
padding-right: 120px; /* Ruimte tussen de herhaalde berichten */
}
/* Het knopje in de tekst */
.lichtkrant-btn {
background: white;
color: #d9534f;
padding: 3px 12px;
border-radius: 12px;
font-weight: bold;
margin-left: 10px;
font-size: 13px;
}
/* De animatie die de tekst van rechts naar links schuift */
@keyframes scroll-lichtkrant {
0% { transform: translate3d(0, 0, 0); }
100% { transform: translate3d(-50%, 0, 0); }
}
</style>