I want to create a ASP.net MVC5 project by using bootstrap template like this one "https://colorlib.com/polygon/metis/dashboard.html#".
I have download it by my browser but i don't know how to add it to my project in visual studio 2013.
I have not find a tuto that help to do that, i just find how to add theme.
May someone know how to do it or a tuto that can show me the way?
Thanks a lot
1.- Create a new project with the MVC structure. Bootstrap and jQuery are already installed.
The folder structure should look like this:
2.- Add your downloaded css in the Content folder
3.- Add your downloaded js in the Scripts folder
4.- Add your html files in differents view folders depending on what you want. You should put the common html elements of all the page in the _Layout page (e.g. Menu or Top bar).
Hope it helps!
Create a Bootstrap class inside the Content folder and name it
bootstrap-anything.css
App Start folder contains configuration files.
The folder should contain 3 files:
BundleConfig.cs
FilterConfig.cs
RouteConfig.cs
Go inside BundleConfig.cs, there should be a function
bundes.Add(new StyleBundle("~/Content/css").Include(
"~/Content/bootstrap.css",
"~/Content/site.css"));
Change
~/Content/bootstrap.css to ~/Content/bootstrap-anything.css
That's it.
Related
I started a new project in VS 2017 and created a ASP.NET Core 2.0 web application (Model View Controller). Then I've changed the conent of the _Layout.cshtml to the interface I want to use (included #Renderbody etc.) and included all the static content it requires in the wwwroot and save and Ctrl+F5 and the layout shows with all the correct formatting and functionality. No problem so far:
However from this point forward none of the static content files of the _Layout shows in any other view. So for example if I visit any of the following URLS:
http://localhost:52786/home/
http://localhost:52786/home/index
http://localhost:52786/home/about
http://localhost:52786/home/contact
I see this:
Startup.cs already has app.UseStaticFiles() in Configure()
So it sounds like you may have your HTML body content in the wrong place. With ASP.NET MVC &ASP.NET Core MVC, the HTML for each page is served up from the /Views directory (by the Home controller by default), not from the /wwwroot, and it is C# HTML (.cshtml) just like the _Layout.cshtml file. Things like images, static javascript etc. are what's typically located in the /wwwroot directory as these are the parts of your website that are client side instead of server-side.
Try replicating your index, about and contact HTML content as .cshtml files under the /Views/Home directory, replacing whatever's there in the template, except for #{ViewData["Title"] = "Home";} located at the top. The layout template should then serve these as the body content (where #renderbody... is in _Layout.cshtml).
If this still doesn't work I'll need a bit more info about what you've changed from the default template. Hope this helps!
Thank you James for your response. I figured it out and it's actually a noob mistake which I'm posting so that other new developers don't get caught in it.
When you want to reference the content in the wwwroot folder if you reference them without "~/" before the name of the directory it works for the _Layout page which fooled me to think it should work for other parts of the application but you should include "~/" before the folder names explicitly otherwise the static files will be un reachable.
I'm starting now with web development in Visual Studio. I have already understood MVC, I have some knowledge of HTML and I started to study the bootstrap.
Then, I discovered the beautiful template Free Bootstrap 3 Admin Template on the web, which has an example online here: https://colorlib.com/polygon/gentelella/index.html
I downloaded the files like custom.css and custom.min.css as they are shown in the following image:
But now I don't know how to put it in my project, so I created a new clean project in Visual Studio Community 2015. I did some tests, and I created some controllers and views.
How can I change the default bootstrap theme that came with ASP.NET MVC project to the downloaded one?
I imagine I should replace the _Layout in the shared folder. But what else should I bring?
I do not want all those example pages, etc. Just Bootstrap and the base layout to create my view's.
I have found everything I needed from a YouTube video, entitled "Plantilla Bootstrap en Proyecto ASP.NET MVC" (obviously in Spanish).
There are many steps:
Adding files to the project
setting the _Layout
set scripts references
bundles
Etc.
Ultimately, it worked.
step one
Create a MVC project Default template in visual studio
Step Two
Delete All cshtml in view folder expect shared folder
you must be detrmine wthich part of your page repeatly in all pages that is your layout and you can put html tag like header menu and footer in /views/shared/_layout.cshtml and write renderbody in part of layout to see default login homepage or etc
finaly
all css and java script folder paste in your project and in layout change target to available js and css resource
Learn about mvc Layout
Understand Css And JavaScript embed from bundle
I have a standard ASP.NET MVC application with Bootstrap. I moved the "Fonts" folder to "Content/Fonts". Inside the folder there are those glyphicons-halflings-regular files.
When I start the application I get a 404 browser error that the Fonts/glyphicons-halflings-regular.woff and glyphicons-halflings-regular.ttf file couldn't be found.
How do I configure my project so these files are found?
Solution was to update pathes in my bootstrap.css.
(See comments of original question)
Thx meep for your help.
One solution is to update paths in bootstrap.css. However, when you update Bootstrap, your changes will be lost. I'd recommend simply moving your stylesheet as well to keep the hierarchical structure found in the unmodified stylesheet.
For example, if you want to move your fonts in the Contents/Fonts folder (I always hate it being loose in the project root folder too haha), have your styles in the Content/Styles folder so that ../fonts/glyphicons-halflings-regular.woff (and so on) still references the correct folder.
I have created a custom theme using Jquerymobile.com themeroller.
A mobile website which i have created using default theme values like .js and .css folders.
Now i want to change that theme of my website to my new custom theme,created using themeroller.
How to include those files to my coding?
When you download the themerolloer that you create, there is a sample index.html file that uses the theme that is enclosed. Look at that to see what files need to be included in your page, but more importantly, look at that code to see what CSS classes are being used - no point in including them in your page if you aren't using using the Themeroller classes
You can see all the steps, and a full tutorial on the Getting Started page
I will like add conventional HTML page under VIEWS folder (in ASp.NET MVC) page.
I have added the route exceptions as mentioned below.
routes.IgnoreRoute("{resource}.htm/{*pathInfo}")
routes.IgnoreRoute("{resource}.html/{*pathInfo}")
Although it does work when I put the html files out of VIEWS folder but I get Page not found 404 when I put those in VIEWS folder. I am also unable to browse the VIEWS folder by setting directory browsing option in IIS.
Please help me on HOW to access HTML file from VIEWS folder.
I think that it's a mistake to mix your HTML content with your views. I'd suggest that you create a separate static folder under Content and put your HTML there. You can create an analogous directory structure to your view structure if necessary for management. Then you don't need to do anything special in order to able to reference the files. You can even, then, open them up to editing with Contribute, etc. by people who are allowed to modify static content.
+-Content
+-Images
+-Static
+-Account
+-privacy.html
+-refunds.html
+-Styles
Usage:
<a href='<%= Url.Content( "~/Content/Static/Account/privacy.html" ) %>'>Privacy Policy</a>
The default Views folder has an Web.config file that explicitly gives 404 errors for all requests. You just need to edit and enable for HTML files (or all files, but then people might snoop).