If you go to http://twitter.github.com/bootstrap/customize.html you can customize Twitter-Bootstrap's css & js files to only include what you need.
However, I don't really understand things like "Code and pre" and have no idea if I need it or not. Is there a resource that goes over the properties of each checkbox option so I have a better idea if I should include it or not?
I'm not sure if there is a resource for that, try downloading only the sections that you have concerns about and inspect them.
about CODE and PRE:
<code> vs <pre> vs <samp> for inline and block code snippets
So that check box is for specific styles for these text elements.
have no idea? you can download all component! http://twitter.github.com/bootstrap/assets/bootstrap.zip
Related
I am using Kentico and have noticed a weird css issue. After mocking my pages up in Dreamweaver I then create the page in Kentico, however I have noticed that some elements in Kentico are slightly misaligned.
I have tried copying the source from Kentico into Dreamweaver to see if I can fix the issue but Kentico still renders the content incorrectly.
Are you using Dreamweaver in design or split mode? if yes, turn it off and use code mode only.
I guess you have to compare structure of your HTML and Kentico output HTML. Kentico add a form tag by default which may cause structural issue with css. If you can provide both html, I can help
On Kentico (up to version 11) when you use portal engine or ASPX templates you have this shortcoming. Kentico adds excessive HTML markup on the controls it creates on order to provide hooks that will help the engine to perform actions. For example, Bizforms add multiple divs/spans around normal input tags. So, you have to adapt the CSS you have created to match the tags used by Kentico.
What is your template type:
ASPX page: You can copy your entire HTML code from Dreamweaver into your aspx page template and then work on your page.
Portal Page: You need to understand the structure and cannot replace entire HTML Code from Dreamweaver. You have to seperate your HTML code to insert DropZone for web parts and widgets.
Good Luck!
You will have to make some adaptation always from raw HTML and kentico. In your case you are using aspx model which makes it more harder as server level changes are not 100% compatible with raw HTML or client side code. If possible use portal engine with transformation which will be more like to like of raw HTML.
You must create a directory in CSS/Stylesheet
If you're using the CSS section of the Admin interface, check to see if you have any & signs at the beginning of any tags. Kentico doesn't seem to support this so might be breaking any classes that appear after it.
I'm new to dnn and 2sxc.
Just wondering if I'm adding for example a card template (image,some text, a link), adding in the html template link tag to css/js, when adding that content more times in the page obviously the link tags are replicate in page source and it isn't so nice.
For example:
<script src="[App:Path]/script.js" type="text/javascript" data-enableoptimizations="100"></script>
it is going to be replicate in page.
Maybe I'm missing something, there is a better way to do it?
Thanks you :)
If you tried it, you should see that it will only be included once, IF you have the data-enableoptimizations included :)
So allready taken care of
Maybe i found the issue...
When I edit a template, selecting Html snippets in the combo to the right, then click on css, style-sheet it is writing a demo link tag, but it is not adding the type (type="text/css"), without it seems not work..
Maybe it could be fixed in a next release :)
I have just recently implemented the five star rating system from ajax, into my asp.net site. Everything works fine in locall debug mode.However. Once i publish it, the css does not show up. I have declared all of the css within the content page, not sure if this is why. I am very in-experienced with working with css; so i am sorry if it something simple.
I have checked the spelling of the image url, and have also tried implementing it into the site.css. But as i said, i am in-experienced; so am not sure what to do here.
This is my code as it stands:
The css declared at the top of the content page:
http://codepad.org/m1w39Hep
The reference to the css from my rating control:
http://codepad.org/Kl0BKets
Thanks in advance!
Check if your css links is right and your css files loaded successfully
I have seen your code.
Give extention as ".css" and not ".c"
I dont think that you can use Codepad for that because it does not give support for CSS.
If you are not using Codepad
Then as you are deploying it in server then check the URLs of the Images that are present in the CSS file for rating/.
I have a website and I want hide the CSS and script files address from source, when user clicked right and press "view source", CSS and script files address were changed. (as well as in firebug).
Like google! please go to google.com and press right click, then "Inspect Element With Firebug", see Style in right box. You will see "www.google.com #2 (line 9)" for example! and you won't see any address for CSS files!
How is this possible?
If you meant viewing the page source and not seeing any style links there, that's because Google uses some JavaScript framework, perhaps GWT: https://developers.google.com/web-toolkit/ . You can see a lot of JavaScript gibberish on the page, right? That JavaScript creates all the style elements etc. in the DOM. And you indeed can see the resulting style definitions when inspecting the elements, be it Firefox or Chrome.
You can do the same. But that design is quite different from classic HTML + JavaScript.
But others are right, you can't hide anything that way, and you shouldnt. It's security by obscurity at best.
As far as I know, you cant prevent users from seeing these files. They can see these files as well as can also download them if they want.
All you can do is to minify these files using some kind of minifier like JS Minifier for JavaScript code.
You can place your css in inline tags. Simply copy/paste the contents into your .html document in a ... block. Then you won't have an external .css file.
The advantage is that you save an http hit. The disadvantage is that you have to download the full css every time because you can't cache it.
You can also minify your css which will obfuscate it to a certain extent. But you can never really hide css from someone who downloads it.
Can anyone recommend a module or other Drupal add-on that can be used to format code nicely like I see on a lot of blogs and websites? Ideally something that would integrate with CKeditor, but that's not critical, I can make do with HTML tags if need be. Thanks.
The two most popular Drupal modules seem to be Code Filter and GeSHi Filter for syntax highlighting. For getting GeSHi to work with CKeditor, check out the WYSIWYG - GeSHi bridge module.
Well, there's http://alexgorbatchev.com/SyntaxHighlighter/ which is javascript. It gets applied at view time.
To see your code highlighted in the actual editor, you're probably going to have to work a bit harder. If it were me, I'd start with http://ace.ajax.org/ , which is an editor that grew out of Mozilla's constantly-renamed in-browser IDE project.
Maybe it's to much but check this
http://drupal.org/project/grammar_parser_ui
Quick follow up: as per this post, the WYSIWYG-GeSHi bridge development has been put on hold because of some problems integrating GeSHi buttons into CKeditor's toolbar (they make all the other buttons disappear). I can confirm that this is the case.
However, if I use GeSHi tags in HTML source, they do format things correctly. The really key thing left out of the GeSHi module documentation is that you need to enable it as an input format in Drupal.
Next I'm going to try this method for integrating GeSHi formatting directly into CKeditor without using the WISYWIG module or any bridges. Thanks again for everyone's help.
There's the Prettify module that implements Google Code Prettify as JS library. It works out of the box but it appears to duplicate the pre tags, that is, one pre tag appears as container for the other one:
<pre class="prettyprint prettyprinted">
<pre class="prettyprint">
<code>
.myClass {
<br>
float: left;
<br>
}
</code>
</pre>
</pre>
That's only annoying because you can't really style the pre tag if there's two of them because all your styles are duplicated leading to double margins, padding, borders. etc.
Still, it works out of the box if you can deal with using the default styles provided with the module, and there are a number of them, i.e. Google Code, Stackoverflow etc.enter link description here