Makeup für die Spenden-Seiten im V6-Template, auch Mobil

12.01.2021 18:12
#1 Makeup für die Spenden-Seiten im V6-Template, auch Mobil
avatar
User

Die Spenden-Seite für das Xobor (v6)-Template, besonders die mit der Beitragsauswahl (Bild 1) ist wohl etwas zu kurz gekommen!
Hier hat die Progressbar-Anzeige keine Form und keine Farbe (evtl. Skriptfehler).
Die letzte Seite mit den ausgewählten Spendenbeitrag ist ganz auf die linke Seite gerutscht und der Spendenbeitrag selbst, fällt kaum auf!

Vorher:


Vorschlag - Könnte so aussehen:



Vorab-Lösung:
Habe nach einer einfach zu installierenden Lösung gesucht, die ohne Plugin auskommt....
Braucht nur fürs V6 oder Mobil in "Eigenes Javascript" kopiert zu werden.

V6: "Admin > Layout > Farben & Einstellungen > Eigenes HMTL/JS"
oder
Nur Mobil: "Admin > Layout > Farben & Einstellungen für das mobile Template > Eigenes HMTL/JS"

Weil keine Variablen so richtig funktioniert haben, ist der Umbau der Progressbar größer ausgefallen.
Aber es funktioniert....

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
<style>
.donation_progress {margin: 0 10px; border-radius:12px;}
.progress-bar {border-radius:12px;}
.donateinfo {margin-top:10px;}
#donationbox .card-body {text-align:left;padding: 30px;}
#donateform .card-body {text-align: center;padding: 30px 20px 20px 20px;}
.donation_goal {text-align:center;}
</style>

<script>
$('.firstrow.col-xl-8').append($("#donationbox"));
$('.donation_progress').attr('id','donation_progress_bar').addClass('progress');
$('.ppercent').append($(".peuro"));
$('.ppercent').addClass('progress-bar').attr('role','progressbar').attr('aria-valuenow','0').attr('aria-valuemin','0').attr('aria-valuemax','100').removeClass('ppercent');
$('.progress-bar').prepend('&nbsp;&nbsp;');
$('.donation_progress span').replaceWith(function() {return $(this).html();});
$('#donationbox .card-body strong:last').replaceWith(function() {return '<center><strong>' + $(this).html() +'</strong></center>'});
$('.donation_amount').addClass('btn btn-primary');
</script>
 



Mehr hier:
Modifizierung nur fürs Xobor (v6) & Mobil - Eigene Seite nicht erforderlich!

Bis dann
Wolfgang

Bereits Mitglied?
Jetzt anmelden!
Mitglied werden?
Jetzt registrieren!