custom login page like aimeos.com/profile (/admin, /login, /profile)

[samvara]

Hello and tx for ideas: I would like to set up a custom login page including the shop-layout

just like this one:
https://aimeos.com/profile

Merci beaucoup

[kdim95]

I'm also interested in this.

It looks like the aimeos site uses a TYPO3 extension for the login page, but we are working with Laravel here:
https://docs.typo3.org/c/typo3/cms-felo ... Index.html

I've personally overriden the login and register page routes only when the pages are opened with GET.

If it's POST, it should handled by breeze and works.

I made a custom AuthController, which helps for displaying my custom login and register views.

But I'm not particularly fond of my solution, I don't know how to get errors from breeze if the login fails.

I also don't know how to add custom code for checking the password strength, check what characters it contains with regex, etc. My current solution could definitely use some improvement.

I hope we can get some details on how to get a custom login page working while preserving the header and footer of the site.

[aimeos]

The login page is a pure Laravel page and it's usually located in ./resource/views/auth/ directory. If you "extend" it from the shop base blade page, you will get the same layout but things like categories, basket, locale selector will be missing.

[samvara]

thanks for the tips.

Yet, I didn't manage to make it work. Please check my approach, tx for a hint


Start
I started to follow aimeos' suggestion, and added a copy to my folder:
custom-theme/views/auth/login.blade.php


1st try:

put in a hello world:
<span class="ml-2 text-sm text-gray-600">{{ __('Remember me') }} hello world</span>

it was still showing the "old" login page.


2nd try:

I added the code below to the file (custom-theme/views/auth/login.blade.php)
to extend it from there. (tiny text is original resources/views/auth/login.blade.php)

Yet: it is still showing the old page.


@extends('xx::base')

@section('aimeos_header')
<title>{{ __( 'Profile') }}</title>
@stop

@section('aimeos_body')
<div class="container-fluid">

<x-guest-layout>
<x-auth-card>
<!-- Session Status -->
<x-auth-session-status class="mb-4" :status="session('status')" />

<!-- Validation Errors -->
<x-auth-validation-errors class="mb-4" :errors="$errors" />

<form method="POST" action="{{ airoute('login') }}">
@csrf

<!-- Email Address -->
<div>
<x-label for="email" :value="__('Email')" />

<x-input id="email" class="block mt-1 w-full" type="email" name="email" :value="old('email')" required autofocus />
</div>

<!-- Password -->
<div class="mt-4">
<x-label for="password" :value="__('Password')" />

<x-input id="password" class="block mt-1 w-full"
type="password"
name="password"
required autocomplete="current-password" />
</div>

<!-- Remember Me -->
<div class="block mt-4">
<label for="remember_me" class="inline-flex items-center">
<input id="remember_me" type="checkbox" class="rounded border-gray-300 text-indigo-600 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50" name="remember">
<span class="ml-2 text-sm text-gray-600">{{ __('Remember me') }} hello world</span>
</label>
</div>

<div class="flex items-center justify-end mt-4">
@if (Route::has('password.request'))
<a class="underline text-sm text-gray-600 hover:text-gray-900" href="{{ airoute('password.request') }}">
{{ __('Forgot your password?') }}
</a>
@endif

<x-button class="ml-3">
{{ __('Log in') }}
</x-button>
</div>
</form>
</x-auth-card>
</x-guest-layout>

</div>
@stop

[MirkoDz]

Has anyone managed to fix the issue with the auth (or any other) pages and include all the header options? I also only managed to extend the base layout, then header does not contain any options except the dropdown profile.

[aimeos]

That' difficult because the Aimeos components are not added by the Laravel login page controller/action

[jafo66]

We were able to make our own Vue pages for login and registration that submit to the Laravel login / register routes. With a little work, we were able to get the error messages returning properly because they used Inertia.

Is this what you were looking for?

[MirkoDz]

For header links to appear in my custom AppLayout, the same way Aimeos renders header, I included this so it works for me!
Than this layout component can be used for all other laravel pages.

<?php

namespace App\View\Components;

use Illuminate\View\View;
use Aimeos\Shop\Facades\Shop;
use Illuminate\View\Component;

class AppLayout extends Component
{
/**
* Get the view / contents that represents the component.
*/
public function render(): View
{
$params = ['page' => 'page-account-index'];

foreach (app('config')->get('shop.page.account-index') as $name) {
$params['aiheader'][$name] = Shop::get($name)->header();
$params['aibody'][$name] = Shop::get($name)->body();
}

return view('layouts.app', [
'aiheader' => $params['aiheader'],
'aibody' => $params['aibody'],
]);
}
}