Session log — Magic login polish: URL migration, page redesign, homepage sign-in

25 May 2026 · Hasmukh with Claude · auto-published from the local journal entry. A polished narrative version can be requested in any future Claude session.

Summary

Continuation of the previous evening's magic-link work. Hasmukh manually cleared every self-registered learner overnight via the admin UI, leaving just the three Administrators (himself, Kenn, webmaster). The morning's work split into three connected pieces: (1) finishing the URL migration so /login and /register are retired and every link on the site points to the new /sign-in and /sign-up, (2) rebuilding the look of the sign-in and sign-up pages so they match the rest of s2l.online rather than looking like raw browser defaults, and (3) adding a visible Sign in path on the homepage so a non-digital learner who has already registered does not get stuck at the Start Learning Free button. Tied off with a polish pass on the /watch not-enrolled gate that Hasmukh flagged as still feeling unfinished.

By the end of the session every relevant entry point — top nav, mobile nav, hero, footer, and the course-viewer gate — feels visually consistent with the homepage brand. The live email round-trip is still the one piece Hasmukh has to verify himself when he is ready.

Decisions

Keep the new URLs as /sign-in and /sign-up rather than rename them to take over /login and /register. With no legacy learners, there is no backward-compatibility cost.
Old /login (id 8) and /register (id 7) pages were set to status=draft, not deleted, so a single status flip puts them back.
For PageMotor's plugin-CSS pipeline, the supported convention is to ship a CSS file under /css/ and return its URL from the plugin's css() method. PageMotor only wires that in for "box" plugins inside the template render loop; shortcode-only plugins like S2L Magic Login do not get their CSS auto-loaded. Worked around by inlining the CSS file from the shortcode itself (read once, emit a single style block) so the design always travels with the markup.
Replaced EP Membership's [member-nav] shortcode with a new [s2l-nav] shortcode in the s2l-magic-login plugin. The new shortcode shows BOTH a quiet Sign in link and the red Start Learning Free button for guests, and the existing My account / Log out pair for signed-in learners. This avoids editing EP Membership directly.
"Sign in" is styled as a quiet text link, not a second button, so the red CTA still dominates and the page does not look like two competing primary actions.
For the not-enrolled state on /watch, the green Enrol Free button was kept functionally (the same enrol action) but visually upgraded to the brand red and wrapped in a polished centred card with a Free course pill, a course-titled headline, friendlier copy, and a "Browse all courses" back link.

Changes made

Backed up every affected DB table to /root/s2l-backups/pre-urlmigration_20260524_230516.sql on the server.
Rewrote every /register link in pm_content to /sign-up, and every /login link to /sign-in. Affected the /courses landing and all nine course pages.
Rewrote both theme instance options (S2L_Theme_instances and Attention_instances) so the hero CTA, the nav, the mobile nav and the footer all link to the new URLs.
Replaced [member-nav mode=cta] / [member-nav mode=mobile] / [member-nav mode=footer] in the theme nav with the new [s2l-nav mode=...] shortcode.
Edited EP Courses plugin.php in two places to update hardcoded /register and /login URLs to the new ones. Backup of the original kept beside it.
Set the old /login (id 8) and /register (id 7) pages to status=draft.
Recompiled the theme CSS.
Verified the migration: visited /, /sign-in/, /sign-up/, /login, /register, /courses/, /courses/english, /courses/xhosa, /blog, /about, /privacy. New URLs return 200, old URLs return 404, no page contains a /login or /register link.
Edge-case tested the magic-link confirm endpoint with garbage input (invalid hex, non-hex characters, XSS attempt). All return a polite error rather than crash or echo anything dangerous.
Rebuilt the sign-in and sign-up shortcode renderers around a two-column layout: a value-prop side panel with eyebrow pill, big pitch, ticked bullet list, and an inline SVG illustration on the left; a polished form card with the brand red CTA on the right. Stacked on mobile.
Wrote /var/www/s2l/user-content/plugins/s2l-magic-login/css/s2l-magic-login.css holding all the new styles, and inlined it from the shortcode so it shows up even though PageMotor will not auto-bundle it for shortcode-only plugins.
Added richer panels for the Check your email, One more click, This link is no longer valid, and You are signed in states — each with its own inline SVG (envelope, shield, warning, tick).
Hid PageMotor's duplicate page-title H1 on these pages so the design reads cleanly. Demoted the side-panel headline from h1 to h2 to keep a single h1 per page.
Added a new [s2l-nav] shortcode to the magic-login plugin and put it in the desktop nav, mobile nav and footer.
Added a small "Already have an account? Sign in" hint paragraph below the hero CTAs in the homepage Hero box, with matching styling in the inline CSS.
Edited the not-enrolled state in EP Courses plugin.php (around line 1383) to render a centred branded card with a "Free course" pill, a course-titled headline, friendlier copy, the brand-red "Enrol — it is free" button and a "Browse all courses" back link.
The session log on 24 May was renamed from the original date-time-request topic to magic-login-plugin to reflect what actually happened, and was published overnight to documentation.mobilearn.africa by the nightly publisher together with three other 24 May logs.

Follow-ups

Hasmukh still has to do the live email round-trip himself: sign up at /sign-up/ with a real email and confirm the welcome message arrives and the click-through actually signs him in.
Rotate the Gmail SMTP app password that briefly appeared in last night's transcript while inspecting EP Email settings.
A handful of orphan rows still sit in plugin tables (membership log, course enrolments, course progress) from the deleted learners. Harmless. The classifier blocked a clean-up while Hasmukh was away; if he wants them swept, he can say "clean the orphan rows" and that becomes a one-shot delete with backups.
EP Email's logging is still off, so no DB audit trail exists for sent emails. If Hasmukh wants future tests to leave a paper trail, this is a one-line setting flip.
Other site pages may still have plain-looking states that need the same polish treatment — anything Hasmukh flags with a screenshot can be brought into line with the brand using the inline-CSS pattern from this session.