How to add graphic or section left of carousel

Hello, I am not familiar with MVC and in the past I have been using Nopcommerce 1.9 as that was the last version that used web forms. Someone in the nopcommerce forums suggested that I use the latest 2.65 version as it was a better version and had more features and that the customization would be easy. What I am want to have is a graphic to the left of the carousel section. In the past I could have added a div with a graphic and floated this left, but I am not sure how to do this in MVC.

Thanks

Hi pdesignz,

We have been using nopCommerce since version 1.5 and we must say that the new nopCommerce 2.x versions are much much easier to work with. Especially if you want to make customization. It is quite simple as you need to open the view where you want to make your changes and just do them. No need of recompiling the code you can see the changes immediately. For example if you want to change something on the Home page you can edit the Razor view: Themes\YourThemeName\Views\Home\Index.cshtml file.
The Razor syntax is a mix of Html + C# code, which makes it understandable from front-end developer and C# developers at the same time.
Simply add your <div> element and that's all.

Best Regards,
Nop-Templates Support Team

I am not familiar with C#, but technically you are saying that on the homepage file
Themes\YourThemeName\Views\Home\Index.cshtml. I have the Jcarousel widget associated with home_page_bottom that before this section I could add a div and then in my css I would float this left. Can I also add images directly to the page, like I can in traditional html or would I need to make a background image via css for this.

So on the homepage I have this...


@{
    Layout = "~/Views/Shared/_ColumnsOne.cshtml";
}
<div class="page home-page">
    <div class="page-body">
        @Html.Widget("home_page_top")
        @Html.Action("TopicBlock", "Topic", new { systemName = "HomePageText" })
        <div class="clear">
        </div>
        @Html.Action("HomepageCategories", "Catalog")
        <div class="clear">
        </div>
        <!--@Html.Action("HomepageProducts", "Catalog")
        <div class="clear">
        </div>-->
        @Html.Action("HomepageBestSellers", "Catalog")
        <div class="clear">
        </div>
        @Html.Action("HomePageNews", "News")
        <div class="clear">
        </div>
        @Html.Action("HomePagePolls", "Poll")
        @Html.Widget("home_page_bottom")
    </div>
</div>

So before the home_page_bottom, I could add a div that is float left. Could I also wrap the home_page_bottom in a div that floats right or will that not work in MVC. If I also want additional images and content can that be added in additional div's like I would in normal html farther down the page

Thanks!

Hi pdesignz,

Yes, you are right. Razor files could be seen as regular html files. You can change them i.e add new div elements, wrap other elements in div elements, add images, etc. Just give it a try and do it. If there is anything you are not sure how to do you can always take a look at the already created Razor view files in the Views folder.

Thanks!