I am new to bootstrap. I downloaded a wrapbootstrap theme and is trying to include that in my website. In the downloaded theme, there are several folders under a folder called assets, like bootstrap, css, js, icons, img. Under bootstrap folder there are again subfolders called css, fonts and js. Can anyone please tell me where exactly in the project should i add these files? In case of a simple theme, I know we need to add the bootstrap css under Content folder and the bootstrap js under Scripts folder and we need to add it in BundleConfig.cs. But here, since there are different css files and js files, where can I include them?
Thanks in advance.
Where the files are located is really irrelevant so far as your application is concerned. The ~/Scripts and ~/Content folders are just a default convention that Visual Studio uses with the templates.
However, nothing is preventing you from moving them. When working with a template, you have one of two choices.
Leave the files as they are, and simply reference them, or include them into bundles in the paths they are located in.
Determine which CSS and JS files you need, and re-shuffle everything to suit your particular projects needs.
The first option makes it easier to upgrade the template in the future, while the second option makes your project files more coherent because they follow a similar structure.
At the end of the day though... it's all just a resource location for you web server to resolve. Do whatever makes sense for your project.
Related
In Shiny, how can I link to an image or a css file that is not in the www folder of the app?
The situation is that I have several apps that share common code, but need to be treated as distinct apps. At the same time I want them to be styled similarly and therefore I want to link to images and css files that are not specific for the app.
The only way I know of linking to images and css files is to place them inside a folder called www in the app directory. But that means that each app will need a copy of the files, because each app has its own www folder.
When running an app I've noticed that Shiny itself links to files in a subfolder called shared/ but I have not yet found where that folder is located. Can I put my custom files there too?
Symlinking from the www folder to a common place comes to mind, but I'd rather not to have to do that. I'm also aware that I can include css styles inline in the html, but that's another thing I want to avoid.
After much searching I finally ran into addResourcePath.
It worked like a charm when added before the shinyApp call.
Created a PHP project in Sublime Text 3 that holds PHP, CSS, JS, HTML, and some other files and folders. Other files may be .md, .txt, .ico, images and fonts (.woff, .ttf, ...).
Actually project is WordPress, but the solution should be for all PHP based projects, and specifically I am interested only to check specific folders inside of project (liek theme and plugin files). WordPress core is no interest for me to check.
I would like to detect Files with extensions (.php, .css, .js) that are unused. Is there a smart solution do detect these?
For instance CSS file is not used if no other files references it. The reference may came from another CSS file or from some PHP file, or even JS file.
I am not searching for a perfect solution, but for something that is close to detect these or even for an idea how I may think about these.
In WordPress (PHP) there are require and include instructions, and also wp_enqueue_script/styles that represent the mechanism how to reference files for instance.
So we could create a list of all PHP, CSS, JS files, and then based on file names search for these in the content of all other files. This would be a good start.
I have a template, one of those you could buy, with many css/js/images, very beautiful.
But I have to control these pages with Ruby on Rails, which I am still learning.
The template files have many directives for other files and folders.
I am trying to understand the Assets Pipeline and I am feeling that it looks not good.
There are dozens of css files, with the directives for many images that are placed in other folders.
I am very scared to be straightforward.
I am not the project owner, I just have these two requirements:
Use this template
Build the system in Ruby on Rails
Could someone indicate me the correct way to get along with this situation.
Thanks a lot.
There is no direct solution to this, but may be this can help: install_theme gem. I haven't used it but the link shows how to use an html/css/js theme in rails application.
Friends,
There is a solution for dummies!
I am feeling so fool.
Inside Rails folders, there is a folder called public
We just have to put our css/js/images inside this folder.
For example, in my template, the index.html was in the same folder then a folder called assets which has sub folder css, js, images
So, the files need for index.html were (relatively to it) in assets/css/... or assets/js/...
Thus, all I had to do was copy my whole folder assets to inside the public directory below Ruby on Rails files.
I found it here:
The Asset Pipeline
I am sorry for the dummy question.
Thanks a lot!
I have created MVC application. When I publish the application on Azure with release option, all css and js file load in a single bundle in page. (Open view source of page then displays a single link for css).
When I publish a site with Debug option in publish profile then all CSS load individual.
My problem is when publish site with release option theme not load correctly, but with debug option theme loads correctly. I want to publish my application with Release option only. If anyone face this issue before and get any solution then please help me.
I have experienced this before when using bundling.
Say for instance your css file is located at: /Content/css/css.css
This css file then makes a reference to another file, or for example an image at /Content/images/image1.png via url('../images/image1.png').
You then set up your css bundle # /bundles/css.
All appears great in debug mode. However, when you set <compilation debug="false" .... in your web.config, suddenly the references made in the css file breaks. If you open your console in Firebug/Chrome dev tools and check the network tabs, you'll see resources failing to load, from an incorrect URL.
This happens because when debug mode is off, all the files are bundled and minified like they would be in production. In this case, the CSS file would be bundled and served from the URL /bundles/css. This results in the relative URL reference breaking. Where it once referenced /Content/images/image1.png, it now references /images/image1.png.
You have a few options to solve this:
Serve your bundled css files from the same folder as the actual css files. eg. /Content/css/cssbundle. This can become very tedious quickly.
Change all relative references in your css files to absolute references. eg. ../images/image1.png would become /Content/images/image1.png. This does mean you can't use a lot third party CSS bundled out of the box, you would have to check/change relative references if you wanted to bundle them.
Use the BundleTransformer nuget package. It automatically transforms relative urls to absolute ones during the bundling process.
The main differences of StyleTransformer and ScriptTransformer classes from a standard implementations: ability to exclude unnecessary assets when adding assets from a directory, does not produce the re-minification of pre-minified assets, support automatic transformation of relative paths to absolute in CSS-code (by using UrlRewritingCssPostProcessor), etc.
I personally recommend 3 as it is the easiest to maintain long term.
Project1.csproj is the website project and StaticContent.csproj is the static content project to hold all .css, .js and image files. I am keeping it separate so that designers can work without touching the main project file and may be use cdn in future. But the problem is how do my .ascx and .aspx pages will refer to these css and js files as that when I run in localhost, it still picks up.
I think the best way is you create a website in IIS for the Static project, and reference it trough something like static.myproject.com (having the appropiate setup) on the other one.
You can still use Webdevserver on Project1.
Is most like what you will have when deploy, and you can put the URL on web.config for easy change