Wondering if anyone knows how to add a custom css stylesheet to the admin backend section, without altering the original masterpages/umbraco.aspx.
I have a custom section implemented, so it has it's own section tray icon, and I can add the css to the 'umbracoGui.css', but I'd like to just 'inject' my own css file for any further styles too, knowing that all of the original files are intact.
In summary, say I have customStyle.css, with all of my css in. To add it to the head of the whole of the admin section.
There seems to be a few mentions of skinning, but it seems a bit overkill to me.
Is there a way of creating a class or something, that can register the stylesheet, or something like that?
Thanks for any help!
Cheers,
Bav
In case anyone is still looking for an answer to this, Umbraco 7 (at least, I'm not sure if this applies to earlier versions) has the ability to inject a stylesheet into pages using the App_Plugins folder. Add a new sub-folder, create a JSON package.manifest file in the new folder that looks something like e.g.
{
css: [ '~/App_Plugins/YourFolder/customStyle.css' ]
}
Then obviously create the custom stylesheet at the specified location in the App_Plugins folder and the stylesheet markup should appear in pages being served.
This may not be much help, but the first thought that comes to mind is some sort of HTTP handler which could inject the CSS file into the markup. I don't have a lot of experience with it, but I know it's a common approach for analytics tracking and the like.
Related
I am relatively new to using ASP.NET MVC5. It is nice that Bootstrap is built in but it seems to be very abrasive to altering the CSS based on the Site.css file.
My style sheet (Site.css) is in the Content folder in my solution.
Similar questions are out there but those are the answers I have tries (show below and obviously having the file AFTER the bootstrap...)
I have had some success using just the inline CSS and jQuery but I want to be able to use my style sheet.
It seemed that switching from relying on the bundle to this line...
#Styles.Render("~/Content/css")
for the reference was better fit... but it STILL doesn't consistently update to my styling.
so then after some digging through old questions I found this...
<link href="#Url.Content("/~Content/Site.css")" rel="stylesheet" type="text/css" />
and it seems like one in a while it works but NOT consistently...
I thought at first it had to do with the strongly types bootstrap file with the elements getting more specific styling points, but even when experimenting with the strongest id/elementname/nesting combinations I could it STILL wouldn't work. (i want to do hovers and such, but even easy things like changing the text color don't work)
Is there some giant flaw in this strategy?
Is there something I'm missing?
To the best of my knowledge this shouldn't be a huge problem, I would appreciate it greatly for someone to help me out or at least tell me why I'm sooooo wrong.
Thanks.
Although the solution provided by EdSF is good it is still not very understandable for someone who has just started with mvc5. So I will try to explain it a little bit more.
Go to
/App_Start/BundleConfig.cs
this is the file where all your stylesheets are bundled.
bundles.Add(new StyleBundle("~/bundles/css").Include(
//"~/Content/css/bootstrap.min.css",
"~/Content/css/Site.css",
"~/Content/css/jquery-ui-1.10.4.min.css"));
comment out the line of bootstrap if you don't want to use it and add you css just like the above. But remember It will remove bootstrap completely and unless you have written you own bootstrap-ish stylesheet for responsive webpage design, you should keep it.
When your view page is rendered in the browser inspect the element that's design is not according to your stylesheet and check the class name on that element and override that class with your own stylesheet class and add !important tag on the style attribute so that it will not be overidden by anything else.
Try these steps. Good luck.
Just to make sure: there's nothing about ASP.Net/MVC etc that imposes anything about styles.
You can use Bootstrap or not, or any other styling framework
Bootstrap isn't "built in", it's just the default when an MVC application is scaffolded for you
That out of the way, you don't have to use Bootstrap if you don't want to.
/App_Start/BundleConfig.cs - this is where you define what CSS and javascript frameworks, files you want to be bundled with your application. Modify (add/remove/etc) it to your needs.
Other than that, overriding CSS classes is pretty much the same as it is anywhere (nothing is imposed by the ASP.net framework).
Hth
RESOLVED: what seemed to be the main issue was not clearing my cache between tests. Although this seems a little tedious, I was finally able to get some Styling in.
but there were 2 more things I tried (from other question on Stack-Overflow) which seemed to all combine to getting it working better. (though it would still be nice if changes consistently reloaded on refresh without restarting the app! (I run parallels so it takes quite a long time!)
ANYWAYS! The (3) changes I made that were most effective
Clearing the cache (so the browser is forced to re-render the script
Changing the name in the "Bundle_Config" from "site/css" to match "Site/css" (not positive why it is like this in the scaffold.. or if it matters...but it seemed to make communication with the file more consistent.
Adding another reference (THIS HELPED THE MOST) adding an additional stylesheet reference to the relative path aside from the built in "renderStyles" from the budleconfig that takes place in the _Layout.cshtml.
<link href="#Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
granted I still need to clear the cache once in a while and restart the app to see changes, I am at least able to change the styling...
thanks for the help everyone!
I'm trying to generate an xml sitemap for published Umbraco content. Ideally I'd like to access UmbracoHelper.TypedContentAtRoot() or something similar that gives easy access to published items. I need to access it outside the web solution, inside a supporting assembly where I'm generating xml sitemaps and sitemap index for dynamic content outside the direct control of Umbraco.
Any ideas about the easiest way to go about this? I've tried referencing various Umbraco assemblies and digging into what's readily available but haven't found anything immediately useful yet.
I have stumbled across
UmbracoContext.Current.Application.Services.ContentService.GetRootContent()
but this seems to require a much deeper understanding about how Umbraco content works under the covers in order to drill down to extract published content for me to index.
Can anyone point me in the right direction? Thanks in advance!
Assuming the DLL you are creating is going to be using IN the umbraco site, you will be able to access UmbracoContent.Current in your classes, as long as you've got a reference to the Umbraco.Core package, as Mivaweb states.
If on the other hand you want to access the UmbracoContext from a completely unrelated external application (say an executable file), then that it MUCH harder to do. A few people have got it sort of working, but it's a bit flakey. Usually in this case, you're better off adding some kind of WebAPI controller action that you can call via HTTP from your executable file, so you have full access to Umbraco on the site.
Update:
If you just want to access the typed content, you can get at it by using:
UmbracoContext.Current.ContentCache
This will allow you to do stuff like:
UmbracoContext.Current.ContentCache.GetAtRoot();
Which will get you all of the root content of the cache.
If you have a seperated project where you would like to do Umbraco stuff then go to the nuget package manager and install Umbraco.Core.
This will install only the necessary Umbraco dll's that you then can use.
Then you just need to include the namespace and you are ready to go.
I would like to make a system where my users can customize the look and feel of my webapp.
My goal is to give them an HTML editor and some predefined tags like [BUYBUTTON] and [PRODUCTLIST] they can use.
These tags should be replaced with actual ASCX controls so that they not only display the HTML output, but have any code-behind functionality.
A generic find and replace of text/html is easy, I can't wrap my head around how to make the controls embed into the template.
Can someone give me a little push in the right direction here? I will be doing this within a DNN module if it matters.
I would look at how DNN's XML Skin parser works.
I wasn't able to find any good tutorials but here is a link so you at least know what Im talking about.
Cheers.
I would suggest to look at the source code of announcement module, which is doing almost same thing that you want to do.
Only difference here is, announcement module is storing the template in settings, so you can have different layout templates for different modules on same page/portal.
Hope this will help you, happy coding
Is it possible to allow a user to customize sections of our website to match their look and feel? For example, to modify logos and CSS, possibly pointing back to their site for the actual content. Ideally I would also like a third-party (ASP.NET) tool to manage this, rather than coding a hack myself.
Edited: I want a solution where a customer can just use a menu to modify the attributes they want, so that there is no need for me to interact with the customer at all.
What you want is a CMS (Content Management System), there are lots out there. Just find one that suits you.
I hear Sitefinity is good.
I have created a webpart in c# for sharepoint.
its basically a form with text boxes, literals, validators and buttons.
im not sure how to render this form to make it look pretty.
The layout etc is being done entirely within this c# class.
At the moment to get started im just overrinding CreateChildControls() method
and adding each form control using something like: this.Controls.Add(submitButton);
any ideas on how best to layout this form?
Thanks.
When creating custom webparts I also prefer to implement them by overriding the CreateChildControls() and Render() methods. In the Render() method I have full control of the html output and I can render my inner controls by calling this.someInnerControl.RenderControl(writer).
Having full control of the html output also makes it easy to style the html using CSS. As other people suggests, use an external CSS file and apply the styes to the class attribute on html elements or CssClass property on ASP.NET web control.
When I implement webparts, that does not require special branding, I prefer to reuse the CSS classes defined by SharePoint. This will ensure that my webpart is visually similar to the webpart provided by SharePoint and that I keep a consistent look and feel.
When using the SharePoint defined CSS styles, you should be aware of your html output. Some of the CSS classes requires a specific html structure to properly render. You can always use the browsers "View Source" to check the html of the SharePoint element you are trying to imitate.
I would recommend grabbing the source from an existing sharepoint page and using the styles defined by sharepoint. This link to the styles in 2003 is old, but still a good guide to get started. Most of the CSS class names haven't changed.
In my web parts I include css files in the solution and inject them in the page using something like:
this.Page.Header.RegisterCss("/_layouts/path/to/css/file.css", false);
You can override the RenderContents(...) method to manually render the HTML in anyway you want to. This includes adding any css includes, scripting includes, etc. that you want/use.
You can render your child controls to strings and then output them as well, but you probably should NOT call the base.RenderContents(...) method.
Just make sure you don't forget to render your child controls.
If it's important for you to see as you design, use the SmartPart which embeds a user control in a web part. (In case you didn't know, user controls can be designed using the tools within Visual Studio.)
If you prefer to hand-code, then you're on the right track. Simply create and set initial properties for your controls within the CreateChildControls() method and use this.Controls.Add() as you have been.
In both cases, where possible use the CssClass property so you can tinker with the look and feel in a CSS file without having to recompile. You could hard-code the CSS class names but it would be better to use the web part properties or an external config source to store these. Have a reference to the CSS file in your master page or inject it into the page using the other techniques mentioned in this answer.
The MSDN articles Web Parts in Windows SharePoint Services or Creating a Basic Web Part might also help.