Checkout page modification and imitation development

Job ID: 37610117

Budget: $300 – $301 USD

This project is an integer amount: USD 300, and the completion time is 1 week.
Modifications from 1 to 12 points: Please read points 13 and 13-2 in detail. If there is a way to do it, I will accept the case again. Thank you.

To put it simply, it is to imitate the checkout method of this website. It is basically the same. Below are the details. To make things easier, the most special one is point 13. That’s why it’s specifically stated.


Right half:
1. Appearance: Completely in accordance with Citiesocia.com's overall "text size, color matching, coupon appearance, including other functions"

2: Change the appearance style of the input coupon to the same as citysocial.com, and 【使用或查看所有折價券】
to the lower left.

3: Move 3-1 and 3-2 to使用或查看所有折價券】at the bottom left
3-1: 總計:657點"可折抵(NT$8)7點 【確定折抵 】
3-2: 訂單結帳將累計:3 點/積分

4: Stable hiding (折價券)

5: System information: Please enter a coupon code., move to the lower left of the discount coupon box.


6: 「顯示訂單摘要」:This part is displayed when the mobile phone or computer adaptively shrinks it.
。Make the same upward and downward direction as the imitation website, when the mobile phone appears or the computer screen is zoomed outAn expandable menu will appear.

Checkout process instructions:
6-1 Click (shopping cart + sales page) "checkout" to enter the checkout page, it will
automatically pop up Exit ~ "Show Order Summary"
⚠️Mobile phone only
6-2 Add the "Continut" button below "Show Order Summary" and stick it to the
bottom, "Click Can be retracted upward and increase hover effect
6-3 Display the order summary: the arrow on the right will rotate up and down

6-4 Special Note:
When there are no products in the order summary, the page will become
Description from top to bottom:
1: Pure text:您還沒有加入商品到購物車中
2: Button: link back to home page
3: Others also buy together:
His original location is at the bottom of →
https://dropshippii.com/cart/ and needs to be copied here.
It's a copy, not a move.
4:Footer:needs to be displayed
Reference URL:
https://xn-czrs0t4phn06a.myshopify.com/password
Website password: shipany


7: Create + add + modify: plus and minus buttons
⚠️When increasing or decreasing the quantity, the price needs to be synchronized in real time and cannot be lagged
. Appearance and function:
7-1:
。For 1 item:
" - " is changed to a garbage truck image (representing deletion of the product)
。When there are 2 items:
" - No." does not need to be changed.
7-2Change 3 pages to the same plus and minus buttons at the same time
s1. Mini shopping cart
s2. Shopping cart page
s3. Checkout page

8: Login member button: changed to the same as citysocial.
8-1:Logged in member:會員結帳
。The button to log in to other member accounts is on the upper right side of the email
chiness text:登入其他會員帳號

8-2:Not logged in member:訪客結帳
。The button is to the right of the title, please see the Citiessocial style
chiness text:登入會員

9: All fields on the left (sort order, color, text settings, system error prompts)
. Please refer to citiesocial.com to change to the same appearance style
. Hide: country/regino, Postcode/ZIP


10: Member status text change: There are two types of member login:
10-1. Guest checkout

10-2. Member checkout.
It is necessary to automatically switch to two types of text under the title: "Guest
Checkout, Member Checkout".

11: Checkout field description:
11-1: Guest Checkout: All fields are required.

11-2::Member checkout: process + field description
When a member login, if there is customer information in the background,
1. After automatically filling in the address, select ☑️ 請選擇常用收件地址
2. The email becomes a light color and cannot be modified.
3. Only 2 fields will appear: (shipping method) + (address)
4. If the member wants to fill in a new address:
The (Address) field contains: "設定新地址"
You need to click to expand it.
(surname, first name, mobile phone number, county, town, city, location
Address) field input and fill in

11-4:If you choose:Pick up at locker/story

。Select store distribution:always hide fields: counties, cities, towns and cities

。 Drop-down store address. After the selection is completed, the data needs to be automatically filled in the (address) field. After completion, the (address) field will be displayed.

。The fields that are always displayed are: last name, first name, mobile phone number
(If a member logs in and has information, he or she will enter his or her last name, first name, and mobile phone number)

12:✅ 帳單與配送地址相同

. The expanded fields are the same as above.
(Be sure to automatically bring in the information you just filled in)
. Font size: Same size as other headings
. Always tick: Don’t let consumers tick and fill in.
(I need to check whether the expansion has included the fields I just filled in.
This is only done with the data)

13: Move the "Shipping Method" on the right to below Email on the left
Style: Change to drop-down ▼.
13-1: Home delivery to your doorstep
13-2:Pick up at locker/story
(There is a "Modify" button next to it for modification)
★Special instructions: 13-2
(The original "pop-up window" is too slow and needs to be "changed to a drop-down window"

!!!!!!! This requires a master to complete this thing. If you cannot complete it, please do not accept this order.

Reference URL:
https://xn-czrs0t4phn06a.myshopify.com/password
Website password: shipany

★Special instructions: 13-2
(The original "pop-up window" is too slow and needs to be "changed to a drop-down window"


14: Counties, cities, towns and cities: changed to the same drop-down menu as citysocial (including the regions inside)
→Please go to the "Account Management" path: https://dropshippii.com/account/】→ In addresses, change

。 Billing address 帳單地址 →edit→"towns, cities and State/Country" are changed to the same drop-down menu

。 Delivery address 配送地址→edit→"towns, cities and State/Country" are changed to the same drop-down menu

15:+Remarks:
. Hide: (optional) text
. Changed to: When you click "+備註", the mention will be
expanded downwards.To fill in the message.