React Next Node MongoDB Car Dealership Site Additions Part 1 of 10

Job ID: 39322509

Budget: $99 – $100 USD

Vertical Search Menu. I need a vertical Side search menu very similar and almost like https://www.brownhondaamarillo.com/used-vehicles/ with few differences, changes and addition. The search menu will have single box in a row, instead of 2 and it will be contained in it’s own section with a scroll bar of it’s own like https://www.cartime.co.uk and https://www.westsideauto.com.au/ and https://www.one2car.com/en and https://www.cardekho.com/ and https://www.carsguide.com.au/. We will make the menu on the right side instead of the left. Different elements will be in boxes of white and grey like the sample website. There will be about 12-15 individual boxes for search terms and parameters, with links to the same Search Engine and search parameters as in the present website.
>So, just like the above website, when the customer clicks any of the Search terms boxes, a Slightly transparent, rectangular Box will open in the center of the page with all the results of the selected parameter or parameters. The box that opens will have the same buttons like VIEW MATCHES and CLEAR SELECTION as in the reference site. But the box for the Models will show the models only in words, like BrownHonda. And there will be an option inside this box that will say “Show Images” and when the customer clicks this Check box, all the images of the models will appear, along with the words, just like how it is on my present website now. All the parameters will still have the square check boxes and this is very important.
> We will have to reduce the size of the 4 Vertical car details boxes a little bit to make space for this menu.
>There will be a horizontal bar or ribbon on top that will show all the parameters that have been selected and total number of cars and Clear All or Reset button and it will stick to the top margin like https://www.westsideauto.com.au/cars?makes=Toyota&models=Toyota%253A%2520Landcruiser%252070%2520Series,Toyota%253A%2520Landcruiser,Toyota%253A%2520Landcruiser%2520Prado
>I have not described everything here and there will be few other things this section will require and we will discuss those when we get there.

Home Page Slider ~ We will combine the Landing page Slider with Inventory in Japan page and so www.sonysauto.com will have the Slider on top and the Inventory in Japan below the Slider. Like the reference image below. And the slider will be with all the “exactly same” animations and font style and appearance and style as https://preview.themeforest.net/item/automotive-car-dealership-business-wordpress-theme/full_screen_preview/9210971 On the Upload page in the backend, I will need an option to modify the duration of each slide and the words of each Slider image. The Font, Style, Size and the animations will remain same, even when I change the words. This option is very important as I will need to modify the words and the message on the Slider from time to time and constantly.

The attached image is what will appear at www.sonysauto.com

The above change or addition is a part of a bigger project worth $100 and listed on https://www.dropbox.com/scl/fi/gll0xms4gy6msissgwiqf/React-Next-Website-Notes-April-2025.docx?rlkey=pp67jgv7bq7ic6hwnoj0m1565&dl=0
Related categories: Website Design Node.js React.js MongoDB Next.js