Ecommerce Website With PHP & MySql - 45 - Registration page - 雙語字幕
So now what we need to do is that we need to walk on the registration form.
And the good news is that we don't need to repeat a lot of things because we already have the login form and we can use the login form and edit that login form to create a
registration form.
So what I'm going to do is that I'm going to create here a new file called resister.html.
And I'm going to copy the entire code from the login.
So from the login I'm going to copy this code the entire page and then I'm going to paste it in the register.
However, we need to edit many many things.
First let me save, let me save everything.
Let me head on over to the browser and here I'm going to say register dot HTML.
If I say register dot HTML, it's going to display the login form.
So we need to change this login form to be the registration form.
So here, instead of saying login, I'm going to say.
register.
And then I'm going to give it here,
here first I'm going to change the login to register,
I'm to say register, and for the registration form we need first to change the ID.
So the form is going to be register form or register Let's say register form just for the sake of keeping the word small and short.
So here for the registration form we need an email, we need a password.
We need the confirmation for the password and we also need the user name.
Therefore, I'm going to the email and then I'm going to paste it above.
But instead of saying email, I'm going to say name.
So this is going to be the name.
and I'm going to say the input type text the classes form control the ID is going to be
register register name
and the name is going to be name
the placeholder is name The second input is email and then here type text class form control and then ID is register email.
The name is email and the placeholder is email.
The third input is the password.
The only thing that we need to change is here, the ID.
So the ID is going to be a register.
register password.
We also need to copy the password and then we need to paste it below it and we need to say instead of password I'm going to say
confirm or password confirmation.
I'm to say confirm password.
Confirm So the type is password, the class is form control, the is the register, confirm password, confirm password.
confirm password or password confirmation let's say let's say confirm password I'm going to say confirm password and the placeholder is gone firm Now,
the tricky part is the baron.
The baron is going to say register,
register, and the ID is register baron, register On other hand, the link is going to say login URL.
I'm going to say here, do you have an account, do you have an account, and login.
So if the user has an account, then they can't.
and login.
Let me save and let me show you how this would look like in the browser.
So you can see, this is how it's going to look like.
However, we need to fix the design and make it look like the login form.
As you can see, the login form looks like this, which looks amazing.
We need to replicate this and apply the same design to the or the registration form.
So I'm going to head on over to CSS, we have the style that CSS, and then I'm going to add your comment.
I'm going to say, I'm going to say, I'm going to say, register.
And then let's start with the registration form.
I'm to say register form.
So that the is going to be similar to the
to the login therefore there is no need to type the code again we can copy the
code from here we can copy this code and paste it here and let me save and let me
show you how this would look like So now, as you can see, it looks like this.
Now we need to work on the other elements.
So the other elements are the buttons and the inputs.
So for the inputs,
we need to say, register, form, input, and the code would be the same as the input that we had in the login.
So I'm going to copy this code.
And then I'm going to paste it.
Next, we need to work on the login button, and we need to work on the registration button, and also the login URL.
So we need to say, register, form.
And then, and then we have here this register BTN.
So I'm going to say here, register BTN.
And the record is going to be same.
We can copy this code.
And lastly, we have the login, we have the login URL, which an ID called login URL.
So for the login URL, I'm just going to say, register, form, login, URL.
And the code again is, is just this line of code.
It's just the color.
The color is orange.
And we will be good to go.
So let me save and let's see how this would look like.
So as you can see, it looks extra ordinary.
except ordinarily amazing and we have the design that looks just similar if not
exact to the login so the login This is the login and this is the registration.
They are the same and they just look amazing.
The elements aligned perfectly, especially the registration button.
It's aligned perfectly with the
解鎖更多功能
安裝 Trancy 擴展,可以解鎖更多功能,包括AI字幕、AI單詞釋義、AI語法分析、AI口語等

兼容主流視頻平台
Trancy 不僅提供對 YouTube、Netflix、Udemy、Disney+、TED、edX、Kehan、Coursera 等平台的雙語字幕支持,還能實現對普通網頁的 AI 劃詞/劃句翻譯、全文沉浸翻譯等功能,真正的語言學習全能助手。

支持全平臺瀏覽器
Trancy 支持全平臺使用,包括iOS Safari瀏覽器擴展
多種觀影模式
支持劇場、閱讀、混合等多種觀影模式,全方位雙語體驗
多種練習模式
支持句子精聽、口語測評、選擇填空、默寫等多種練習方式
AI 視頻總結
使用 OpenAI 對視頻總結,快速視頻概要,掌握關鍵內容
AI 字幕
只需3-5分鐘,即可生成 YouTube AI 字幕,精準且快速
AI 單詞釋義
輕點字幕中的單詞,即可查詢釋義,並有AI釋義賦能
AI 語法分析
對句子進行語法分析,快速理解句子含義,掌握難點語法
更多網頁功能
Trancy 支持視頻雙語字幕同時,還可提供網頁的單詞翻譯和全文翻譯功能