Ausblendung Trenner im Footer bei Anmeldung

Andere Lösungen
Post Reply
Gonzo Gates
Posts: 197
Joined: Thu 19. Jan 2023, 21:46

Ausblendung Trenner im Footer bei Anmeldung

Post by Gonzo Gates »

Hallo Gemeinde,

Anmerkung
---------

Was mir bei jedem Template auf den Keks ging, dass ich, wenn ich angemeldet war, immer noch die Pipe '|' hinter dem ganzen Footergeseier sah. Also Hand anlegen. Hat dazu geführt, dass ich auch bei dem Dialog 'Anmeldung' und 'Anmeldung fehlgeschlagen' Hand anlegen musste. Und Arbeit zieht Arbeit nach sich!

Ich habe nach bestem Wissen und Gewissen aus meiner ellenlangen Dokumentation versucht die richtigen Code-Schnipsel herauszuholen. Bei dem Umzug von CMSimple V5.9 auf V5.11 habe ich Dank meiner Doku nur 3 Stunden gebraucht, bis es wieder so aussah wie vorher. OK, vielleicht 4. Es sei dazu gesagt, dass ich auf eine Vanilla-CMSimple V5.11 umgezogen bin. 'diff' ist manchmal ein gutes Werkzeug ;-)

Noch etwas: Beim 'Debuggen' ist mein Orakel, der Seitenquelltext, ein guter Freund oder Eine Textzeile von FURT:"Was nicht geht, geht nicht!" - Also wieder zurück rudern!

Änderungen
----------

Ich fand es doof, dass man zur 'Anmeldung' immer nach unten scrolen muss. Deshalb einen 'Button' 'Zur Anmeldung' in die 'FixedNav' eingefügt, der bei klick nach unten zur Springmarke scrollt.

Code: Select all

<?php echo loginlinkscroll();?><!-- DOR: In 'CMSroot\cmsimple\functions.php' Funktion 'loginlinkscroll()' erstellt. Hier ist es zu kompliziert und funtzt nicht beim ersten Aufruf der Site!!! Aber es geht, wenn man einen anderen 'Scroll-Link' betaetigt hat -->
(Habe ich im Footer umgekehrt auch mit 'Zur Suche' gemacht)

Im Footer 'loginlink()' in ein span-Tag integriert, Klasse (andere Formatierung des Links) und ID (Sprungmarke) hinzugefügt.

Aus meiner/meinen 'template.html' die Pipe '|' vor 'Anmelden' entfernt.

In 'CMSroot/cmsimple/languages/de.php'
......................................

Code: Select all

$tx['menu']['login']="Anmelden"; /* DOR: Text geaendert */
$tx['menu']['login_title']="Anmeldung"; /* DOR: hinzugefuegt fuer Ueberschrift und Test Locator/Breadcrumb */
$tx['menu']['login_slide']="Zur Anmeldung"; /* DOR: hinzugefuegt */
In 'CMSroot/cmsimple/functions.php'
...................................

Code: Select all

function a_scroll($i, $x) // DOR: Kopie von 'a()' und angepasst fuer Loginlink Footer
{
    global $sn, $u, $cf, $adm;
    if ($i == 0 && !$adm) {
        if ($x == '' && $cf['locator']['show_homepage'] == 'true') 
		{
            return '<a href="' . $sn . '?' . $u[0] . '">';
        }
    }
    return isset($u[$i]) ? '<a href="' . $sn . '?' . $u[$i] . $x . '" alt="Y">' : '<a href="' . $sn . '?' . $x . '" alt="X">'; // DOR: mal schauen wer ich bin
}

function a_wrongpw($i, $x) // DOR: Kopie von 'a()' und angepasst fuer Kennwort neu eingeben
{
    global $sn, $u, $cf, $adm;
    if ($i == 0 && !$adm) {
        if ($x == '' && $cf['locator']['show_homepage'] == 'true') 
		{
            return '<a class="dor_login_falsch_neu_anmelden_link" href="' . $sn . '?' . $u[0] . '" alt="0">';
        }
    }
    return isset($u[$i]) ? '<a class="dor_login_falsch_neu_anmelden_link" href="' . $sn . '?' . $u[
$i] . $x . '" alt="Y">' : '<a class="dor_login_submit_button dor_login_submit_button_falsches_kw" href="' . $sn . '?' . 
$x . '" alt="Ich bin erster bei neuer Anmeldung">'; // DOR: mal schauen wer ich bin -> Klasse 'dor_login_falsch_neu_anmelden_link' gegen 'dor_login_submit_button' ausgetauscht und mit der anderen Klasse das Knoeppie nach rechts geschubst
}

function loginlinkscroll() // DOR: Als Kopie von loginlink() fuer scrollen zum 'Anmelde-Link' hinzugefuegt und angepasst und in 'FIXED NAVIGATION' eingefuegt
{
    global $cf, $adm, $sn, $u, $s, $tx, $pth; // DOR: globale Variable '$pth' hinzugefuegt
    if (!$adm) 
	{
		//return a($s > -1 ? $s : 0, '&amp;login') . $tx['menu']['login'] . '</a>';  
		return a_scroll($s > -1 ? $s : 0, '#dor_footerLoginLink') . '<img src="' . $pth['folder']['templateimages'] . 'login3.png" title="' . $tx['menu']['login_slide'] . '" class="dor_loginlinkButtonScroll">' . '</a>'; // DOR: Scroll zum "Anmelden-Link" in 'CMSroot/templates/tmpl_rezepte/template.htm' oben eingefuegt. Der verschwindet, wenn man beim CMS angemeldet ist. Bild 'login3.png' neu erstellt
    }
}

function loginlinkwrongpw() // DOR: Als Kopie von loginlink() fuer falsche Anmeldung
{
    global $cf, $adm, $sn, $u, $s, $tx;
    if (!$adm) 
	{
		//return a($s > -1 ? $s : 0, '&amp;login') . $tx['menu']['login'] . '</a>';  
		return a_wrongpw($s > -1 ? $s : 0, '&amp;login') . $tx['menu']['login'] . '</a>'; // DOR: Pipe/&DoubleVerticalBar; vor Login-Link bei Meldung 'Falsches Kennwort' bei Link 'Anmelden' entfernt
    }
}

function loginlink()
{
    global $cf, $adm, $sn, $u, $s, $tx;
    if (!$adm) 
	{
		//return a($s > -1 ? $s : 0, '&amp;login') . $tx['menu']['login'] . '</a>';  
		return ' &DoubleVerticalBar; ' . a($s > -1 ? $s : 0, '&amp;login') . $tx['menu']['login'] . '</a>'; // DOR: erst Pipe, dann '&DoubleVerticalBar;' zwischen 'Suche-Link' und 'Login-Link' aus 'CMSroot/templates/tmpl_rezepte/template.htm' im Footer entfernt und hier eingefuegt. Das war mir schon immer ein Dorn im Auge, dass die Pipe zu sehen war, wenn man 'Eingelogt' war.! Jetzt verschwindet das Ding, wenn man angemeldet ist. War Grotte gemacht und mein Ding funzt auch bei 'Logout' (Abmelden)
    }
}

In 'CMSroot/cmsimple/login.php'
...............................

Einiges auskommentiert, was mir nicht gefiel.

Code: Select all

function loginforms() 
{
	global $adm, $cf, $print, $hjs, $tx, $onload, $f, $o, $s, $sn, $u;

	if ($f == 'login') 
	{
		$cf['meta']['robots'] = "noindex";
		$onload .= "self.focus();document.login.passwd.focus();";
		$f = $tx['menu']['login_title']; // DOR: hier ist die Titeltextuebergabe an Locater/Breadcrumb
		$o .= '<div id="cmsimple_loginform" class="cmsimple_loginform">
<h6>' . $tx['menu']['login_title'] . '</h6><hr><!-- DOR: Text-Variable geaendert und hr-Tag hinzugefuegt -->
<div style="/*margin-left: 15em;*/" class="dor_cmsimple_loginform">
<form id="login" name="login" action="' . $sn . '?' . $u[$s] . '" method="post">' . "\n"
 . tag('input type="hidden" name="login" value="true"') . "\n"
 . tag('input type="hidden" name="selected" value="' . @$u[$s] . '"')  . "\n"
// DOR: fuer mich reicht das 'Anmelden'-Textfeld. Neu 'formartiert'
// . "\n" . 'User (optional): ' . tag('br') -> 'optional' kann mich mal...
// . tag('input type="text" name="user" id="user" value=""') 
// . ' ' . "\n" . tag('br') . 'Password: ' . tag('br')
 . '<h5 style="margin-bottom: 5px; color: #333;">' . $tx['login']['password'] . ':</h5>' . "\n" // DOR: Ueberschrift kleiner und andere Farbe 
// . tag('input type="password" name="passwd" id="passwd" value="" placeholder="Kennwort" style="background: rgba(238, 238, 238, .7); /* DOR: #eee, aber mit opacity sieht man das header-bild */ color: #222; float: left; font-size: 16px; font-weight: 500; border: 1px solid #930; border-radius: 0 18px 18px 0; box-shadow: 2px 2px 2px rgba(153, 51, 00, 1), -2px 2px 2px rgba(153, 51, 00, 1), 2px -2px 2px rgba(153, 51, 00, 1), -2px -2px 2px rgba(153, 51, 00, 1); /* DOR: #930: Danke https://www.w3schools.com/cssref/css3_pr_box-shadow.php */ "') . ' ' . "\n" . tag('br') . tag('br')
// . tag('input type="password" name="passwd" id="passwd" value="" placeholder="' . $tx['login']['password'] . '" class="dor_login_textfeld"') . ' ' . "\n" . tag('br') . tag('br')
 . tag('input type="password" name="passwd" id="passwd" value="" placeholder="EhneMehneMuh" class="dor_login_textfeld"') . ' ' . "\n" . tag('br') . tag('br')
// .  tag('input style="cursor: pointer" type="submit" name="submit" id="submit" class="submit" value="' . $tx['menu']['login'] . '"') . '
//  .  tag('input type="submit" name="submit" id="submit" class="dor_login_submit_button" value="' . $tx['menu']['login'] . '"') . '
 . '<button type="submit" name="submit" id="submit" class="dor_login_submit_button">' . $tx['menu']['login'] . '</button>
</form>
</div>
</div>';
		$s = -1;
	}
}
---------------------------------------

Für die 'Anmelden-Box' und die 'Neuer Versuch Anmelden-Box' habe ich mir auch schöne Dinge ausgedacht, weil es mir auf den Sack ging, wie sie im Standard aussehen.

CSS
---

Code: Select all

span.dor_footerLoginLink a:link {padding: 0 5px; font-weight: 800; color: rgba(221,221,221,1) /*#ddd*/; background: rgba(119,17,0,1) /* DOR: hinzugefuegt - padding l/r hinzugefuegt, Text fetter formartiert */

.dor_login_textfeld[type=password]{ /* DOR: hinzugefuegt -> inline Style aus 'login()' heraus gezogen und als 'class' eingebunden  */
  height: 25px; padding-left: 10px; background: rgba(238, 238, 238, .7); /* DOR: #eee, aber mit opacity sieht man das header-bild */ color: rgba(34,34,34,1) /*#222;*/ float: left; font-size: 16px; font-weight: 500; border: 1px solid rgba(153, 51, 00, 1); border-radius: 0 18px 18px 0; box-shadow: inset 0px 0px 3px rgba(153, 51, 00, 1);
}

.dor_login_textfeld[type=password]:focus {outline: rgba(153, 51, 00, 1) solid 1px; outline-offset: -5px;} /* DOR: hab das dusselige 'outline-blau' ueberschrieben */

.dor_login_falsch_bereich { /* DOR: hinzugefuegt fuer 'CMSroot/cmsimple/login.php' und inline-style abgeloest */
  width: 280px; 
  text-align: center; 
  border: 1px solid rgba(153, 51, 00, 1); 
  /*border-radius: 3px; */
  border-radius: 0 25px 25px 0; /* DOR rounded corners rechts */
  box-shadow: inset 0px 0px 4px rgba(153, 51, 00, 1);
  padding: 24px; 
  margin: 50px auto; /* DOR: Wert von 100 auf 50 runtergedreht */
}

.dor_login_falsch_neu_anmelden_link { /* DOR: hinzugefuegt fuer 'CMSroot/cmsimple/login.php' und inline-style abgeloest -> 'color' und 'font-weight' sind '!important', damit der Style wirkt! */
  color: #fff!important; 
  font-weight: 800!important; 
  background: rgba(153, 51, 00, 1); 
  padding: 1px 6px 1px 6px;
}

.dor_login_falsch_neu_anmelden_link:hover { /* DOR: hinzugefuegt , 'color' muss '!important' sein */
  color: rgba(221,221,221,1)!important; /* #ddd*/
}

div.dor_cmsimple_loginform { /* DOR: hinzugefuegt fur Anmeldung, bringt aber nix, statt dessen Inline-Style in 'CMSroot/cmsimple/login.php' -> und wenn der Arsch vor dem Fernseher es von Anfang an richtig gemacht haette, dann waere nicht so viel Bier die Kehle heruntergeflossen!!!  */
  display: block;
  width: 9em;
  /*margin-left: 15em;*/
  margin: 0 auto;
  padding: 0 4em 1em 3em;
  border: 1px solid rgba(153, 51, 00, 1);
  border-radius: 0 25px 25px 0; /* DOR rounded corners rechts */
  box-shadow: inset 0px 0px 4px rgba(153, 51, 00, 1);
}

.dor_login_submit_button {
  display: block; /* DOR: Wollte den 'Anmelden-Button' abrunden - hinzufuegen hat nix gebracht bei input-Tag - bei button-Tag schon */
  padding: 5px; 
  /*margin: 10px 10px 10px 200px;*/
  height: 30px;
  width: 13.8em;
  color: rgba(68,68,68, 1)!important;
  font-weight: 600;
  outline: rgba(153, 51, 00, 1) solid 1px; /* DOR: hinzugefuegt - #930  - outline-offset: -5px;*/
  box-shadow: /* https://www.cssportal.com/css3-rgba-generator/ rgba = Red, Green, Blue, Opacity 
                 https://www.color-hex.com/color/b52c07 */ 
              rgba(204,204 ,204, 1) 0px -25px 25px 0px inset, /* DOR: #ccc, volle deckung */
              rgba(153 , 51, 0, 1) 0px -10px 50px 50px inset, /* DOR: #910 oben, volle deckung mit verlauf nach unten */
              rgba(68,68,68, 0.1) 4px 4px 6px; /* DOR: #444 */
	cursor: pointer; /* DOR: Inline-Style aus dem Script entfernt */
	text-decoration: none;
	border: 0 transparent;/* DOR: hinzufuegen hat nix gebracht bei input-Tag - bei button-Tag schon*/
	border-radius: 0 15px 15px 0; /* DOR: hinzufuegen hat nix gebracht bei input-Tag - bei button-Tag schon*/
	transition: all 1s ease-in-out; /* DOR: hinzugefuegt und jetzt blendet sich der Button langsam wieder um in die alte Farbgebung, wenn MouseOut angesagt ist */
}

.dor_login_submit_button:hover
{
  color: rgba(231,231,231,1)!important; /* #ddd; /* Textfarbe geaendert */
  box-shadow: rgba(153 , 51, 0, .7) 0px -25px 25px 0px inset, /* DOR: #910 mit opacity */ 
              rgba(204,204 ,204, 1) 0px -10px 50px 50px inset, /* #ccc oben, volle deckung mit verlauf nach unten und mehr Unschaerfe-radius,  Schatten-radius als button-Tag */
              rgba(68,68,68, 0.1) 4px 4px 6px; /* DOR: Schatten #444 und den unteren Rest gausgeschmissen */
  text-decoration: none;
  transition: all 1s ease-in-out; /* von 1s auf 5s erhoeht und ist behaebig. vielleicht mal mit @keyframes animation_link_fontane ausprobieren. NICHT JETZT!!! */
}
.dor_login_submit_button_falsches_kw { /* DOR: hinzugefuegt fuer 'Falsche Anmeldung' Dialog Werte von Knoeppi-Anmelden angepasst */
  width: 10em; /* Knoeppi-Breite an Dialog angepasst */
  margin: 12px auto; 
  /*padding: 5px;*/
  height: 20px;/**/
  padding-top:: 2px;
  font-size: 16px;
  font-weight: 600;
}
------------------

Es ist mir sch...weine egal, ob euch meine Kommentare interessieren, zumal ich die meisten schon heraus geschmissen habe. Ich behalte meine Kommentare bei Fehlschlägen, damit ich weiß, wie es nicht funktioniert. Wie sagte Edison so schön:"Ich habe nicht versagt. Ich habe nur 10.000 Wege gefunden, wie es nicht funktioniert." oder "Ich bin nicht entmutigt, denn jeder erkannte Irrtum ist ein weiterer Schritt nach vorn.".

Gruß
Gonzo

@Gert: Danke für das Prädikat 'Bastler'
Ich kenne keinen Sysadmin oder Programmierer, der sich noch nie ins Knie geschossen hat :!:
Gert
Posts: 2135
Joined: Sun 18. Nov 2012, 14:18

Re: Ausblendung Trenner im Footer bei Anmeldung

Post by Gert »

Gonzo Gates wrote: Fri 26. May 2023, 16:14 Was mir bei jedem Template auf den Keks ging, dass ich, wenn ich angemeldet war, immer noch die Pipe '|' hinter dem ganzen Footergeseier sah.
In der template.htm:

Code: Select all

<?php if(!$adm) echo' | ';?>
Die "Pipe" wird nur angezeigt, wenn nicht eingeloggt.

Code: Select all

<?php if(!$edit) echo' | ';?>
Die "Pipe" wird nur angezeigt, wenn nicht im Bearbeitungsmodus (nur zur Info).

-----------------------------
Gonzo Gates wrote: Fri 26. May 2023, 16:14 Ich fand es doof, dass man zur 'Anmeldung' immer nach unten scrolen muss.
Mit kleinen Änderungen in der ./cmsimple/login.php und der ./css/core.css und einer transparenten png als Hintergrund könnte das so aussehen (Lightbox Stil):

https://www.ge-webdesign.de/demotpl/?Te ... ltig&login

Kannst ja mal ein falsches Passwort eingeben, die Meldung erfolgt dann auch im Lightbox Stil.

Das werde ich dann wohl in die nächsten Version so aufnehmen,

Gert
Gert Ebersbach | CMSimple | Templates - Plugins - Services
Gonzo Gates
Posts: 197
Joined: Thu 19. Jan 2023, 21:46

Re: Ausblendung Trenner im Footer bei Anmeldung

Post by Gonzo Gates »

Hallo Gert,

vielen Dank für die Info, das Beispiel und die Blumen...

Gruß
Gonzo

Ach ja: Ich hatte ja geschrieben, dass ich keine Konifere beim Rumproggeln bin, aber ich weiß mir zumindest zu helfen: "Wer Code lesen kann ist klar im Vorteil!"
Ich kenne keinen Sysadmin oder Programmierer, der sich noch nie ins Knie geschossen hat :!:
Gonzo Gates
Posts: 197
Joined: Thu 19. Jan 2023, 21:46

Re: Ausblendung Trenner im Footer bei Anmeldung

Post by Gonzo Gates »

Hallo Gert,

habe vergessen zu schreiben, das deine Idee der Anmeldung gut aussieht.

Warum transparentes PNG? Ginge doch auch mit 'rgba((68,68,68, .4)' -> [#444].

Aber wenn denn deutsch, dann doch bitte 'Anmeldung', 'Benutzername' und 'Kennwort' ('Password' war in der 'login.php' hart eingetragen) ;-) So habe ich es in meiner 'de.php' eingetragen und im Quellcode verwurstet.

Nochmal Danke
Gonzo
Ich kenne keinen Sysadmin oder Programmierer, der sich noch nie ins Knie geschossen hat :!:
Gert
Posts: 2135
Joined: Sun 18. Nov 2012, 14:18

Re: Ausblendung Trenner im Footer bei Anmeldung

Post by Gert »

Gonzo Gates wrote: Tue 30. May 2023, 03:32 Warum transparentes PNG? Ginge doch auch mit 'rgba((68,68,68, .4)' -> [#444].
Ja - ginge auch so. Aber dann eher rgba(0,0,0, 0.75) - oder so: #000000cc ...

Ich habe mir das mit den .png angewöhnt, als CSS3 noch nicht Standard war. Bin halt konservativ, sowohl politisch als auch prorammiertechnisch ;)

Gonzo Gates wrote: Tue 30. May 2023, 03:32 Aber wenn denn deutsch, dann doch bitte 'Anmeldung', 'Benutzername' und 'Kennwort' ('Password' war in der 'login.php' hart eingetragen)
Ist doch nur 'ne Demo :roll: ;)

In der nächsten Version werde ich die notwendigen Sprachvariablen zumindest in der default.php einführen, dann sind sie in Englisch vorhanden und können im Backend übersetzt werden, wie auch immer es der Anwender wünscht. Von mir aus dann auch "Benutzer:In Name", aber das werde ICH ganz bestimmt nicht anbieten :lol:

Für die "ewig zufriedenen", die die Sprachdateien unberührt lassen, und für Neuinstallationen wird es dann auch neue de.php und en.php geben ;)

Gert
Gert Ebersbach | CMSimple | Templates - Plugins - Services
Gonzo Gates
Posts: 197
Joined: Thu 19. Jan 2023, 21:46

Re: Ausblendung Trenner im Footer bei Anmeldung

Post by Gonzo Gates »

Hallo Gert,

in der 'CMSroot/cmsimple/functions.php' die Funktion 'loginlink()' wieder auf Standard zurückgedreht.

In die 'template.htm' habe ich folgendes aufgenommen:

1. Versuch (2 Möglichkeiten):

Code: Select all

<?php if(!$adm && !$edit) echo' &DoubleVerticalBar; ';?>
<?php if(!$adm and !$edit) echo' &DoubleVerticalBar; ';?> 
Klappt: '&DoubleVerticalBar' wird ausgeblendet egal ob 'Bearbeitungsmodus' oder 'Ansicht' (angemeldet -> '$adm' == true).

2. Versuch (2 Möglichkeiten) (verworfen):

Code: Select all

<?php if(!$adm || !$edit) echo' &DoubleVerticalBar; ';?>
<?php if(!$adm or !$edit) echo' &DoubleVerticalBar; ';?>
Klappt bedingt: '&DoubleVerticalBar' ausblenden nur im 'Bearbeitungsmodus'. Klappt nicht: Bei 'Ansicht' (angemeldet -> '$adm' == true) wird '&DoubleVerticalBar' wieder angezeigt. Zu dem Zeitpunkt bin doch '$adm' und angemeldet.

Dann kamen Gedanken auf:

Code: Select all

Wenn '$adm' == true mach nichts
Wenn '$edit' == true mach nichts
Wenn '$adm' == true oder '$edit' == false mach nichts
Habe ich da bei Verwendung des logischen ODER im Unterricht gefehlt? :?

Hier ist nicht mal von Xor oder Xand die Rede. Ich erinner mich daran, das vor über 15 Jahren W^X (Write Xor Execute) in den OpenBSD Kernel für die Kontrolle der Prozesse Einzug gehalten hatte. Da wir schon Mal dabei sind, finde ich 'pf' von OPenBSD besser als 'iptables' und 'nftables' bei Linux. Na ja, wobei 'nftables' nahe dran sein müsste an 'pf'. 'pf' ist ja bekanntlich, vor einigen Jahren, in den FreeBSD Kernel integriert worden. Und Genua hatte sich vor einigen Jahren für OpenBSD als Firewallsystem entschieden, da die Release-Zyklen kürzer sind, als die von FreeBSD.

Mir sind die Gedanken durchgegangen (Stampede!)...

Eine Anekdote noch: Vor einigen Jahren hatte ein Kollege gesagt, dass er mit den Berchtigungen auf seinen Linux-Systemen Probleme hätte und hat dann einfach 'chmod -R 777 /*' gesetzt hat. OK, andere machen 'rm -rf *', wenn sie sich in der root befinden :-D

Bei der Ansicht 'falsche Kennworteingabe' und 'ScrollToLogin' bleibe ich bei meinem Coding. Ist ja dokumentiert.

*nix Gruß
Gonzo

Was Anderes: Vielen Dank für die Seite: https://www.ge-webdesign.de/demotpl/?Te ... hriftarten. in Meiner Testseite habe ich mit den Frakturschriften auch schon herum experimentiert, aber dieser Einblick hat ein ganz anderes Licht darauf geworfen. Mit KleistFraktur klappt '\z' übrigens nicht ;-)
Ich kenne keinen Sysadmin oder Programmierer, der sich noch nie ins Knie geschossen hat :!:
Post Reply