Kentico CSS issue - css

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.

Related

Multiple editors in a Single Page

I want to achieve multiple editors on a single page. Like two editors in a single page. Do not want to use plugins; pure native coding.
CKEditor supports multiple inline as well as classic (contents in iframe) editors on a single page.
In both cases it is enough to specify path to ckeditor.js script on header page and CKEditor code will automatically:
change all div elements with contenteditable attribute to inline editors
"change" all textarea elements with class ckeditor to classic editors
Please also have a look at below samples and documentation links to get a better idea of how you can use multiple CKEditor instances on a single page:
http://nightly.ckeditor.com/17-11-11-07-04/full/samples/old/replacebyclass.html
http://nightly.ckeditor.com/17-11-11-07-04/full/samples/old/inlineall.html
https://docs.ckeditor.com/ckeditor4/docs/#!/guide/dev_framed
https://docs.ckeditor.com/ckeditor4/docs/#!/guide/dev_inline
EDIT:
Additionally you can use the replaceAll method which replaces all textarea elements which match your criteria. This method requires writing JS on HTML page.
Don't need to use a plugin.
TinyMce support multi-editor in one single page.
See documentation :
https://www.tinymce.com/docs/get-started/multiple-editors/

Django CMS Deleting HTML5 Tags and Attributes

I am having a big time issue with solving a problem. I have a placeholder called main for the content region of the page. I was building that region in the cms. Everything was going great until I attempted to add an embedded video contained in an iframe. When I save django cms completely removed the iframe and left an empty div. So I attempted to use prettyphoto light box to open the video by clicking on an image. The code I added to the page through the cms is:
<a rel='prettyPhoto[youtube]' href="https://www.youtube.com/embed/mqVZF_yb8C0?autoplay=1&start=1765&iframe=true" data-rel="prettyPhoto">Click Image</a>
When I saved, django cms completely removed the data-rel attribute from the link which is obviously needed for the js. So I went a step further and adapted the code of the data attribute to:
rel="prettyPhoto"
and the cms also removed that attribute! Also anytime I add an html5 tag like article of section it hates that too! What gives here? Am I doing something wrong? Any advice would be appreciated. 
Aaron,
Thanks.
Please see the discussion at https://github.com/divio/django-cms/issues/1529. We use html5lib to clean the contents of the text plugin (this cannot be turned off for security reasons).
What you'll want to do is write a custom plugin (possibly one that can be embedded inside text plugins).

Css not working on published sites

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/.

mx:HTML window - data scraping a php page?

I have a Flex mx:HTML component which uses an html window to display html data from 3rd party website.
let's call the page:
http://www.company.com/page.php (not a _real page (duh))
There is alot of "trash" displayed.
I used "Firebug" to inspect the webpage elements.
I see that the section of the page I want to display is:
/html/body/div[4]/div[2]/div/div[2]
or, to put it a another way:
html body.landing div#content-bg div#content-wrap div#content div.main
my question:
Is there a way to access this section of the page only, especially since it is "rendered" using PHP (which I have no knowledge or understanding of)?
(I will NOT be using PHP to gather this info)
many thanks!
Mark
Take a look to Flex IFrame which enables HTML Browsing in Flex apps.
You can try this URL.

How do I use Google Analytics with Sitecore 6?

I know that I need to add the tracking code snippet at the bottom of all my pages, but is there a central location to do this?
Or do I need to add this tracking code to all of my templates?
I guess that I could wrap the snippet in a user control, or external .js file, and reference it on each page, but is there a global footer somewhere? The site I'm working on has about 30-40 layouts, and adding it to each one would be a pain!
Thanks in advance!
Actually, the role of a Sitecore layout is exactly this; to act as a global file that all individual page templates "derive" from.
Normally you'd stick the analytics code into the master layout, and use Sitecore sublayout/placeholder techniques to construct the various page templates you need. You would not normally need more than perhaps one or two layouts for any device you are serving content to. And I guess for most sites, the only device in use is regular web content delivery.
That being said, what you could do, is have all the layouts inherit their codebase from a common base class (inheriting from Page), and inject the google code centrally from here. Would still require you to go through all layout files however.
I have not tried the module, I think that is codebehind version. I have made this in XSLT, its pretty fast and easy to make. I have footer.xslt where I put the code that simply checks if page you are standing on uses template that I want to index and does not belong to page names that I want to exclude. Then I have an item with a custom template for Google Analytics with following memo fields.
IncludeTemplates -field contains list of templates that I want to include for analytics :
ExcludeItemsNames -field for excluding pages by item name
contains($includeTemplates, concat('|',./#template,'|')) and not(contains($excludeItemNames, concat('|',./#template,'|')))
Remember #key and #template is always in small letters
If you run many domains don't forget to add pageTracker._setDomainName("www.example.com"); in analytics script so you can separate sub-domains etc. if they use same footer.xslt
Normally we consider the actual Google code as content. Within Sitecore we normally have a settings folder, something like /sitecore/content/settings. This exists outside the root of the site. Beneath this have a settings item with a plain multi-line text field, I think the field type is memo or something similar.
Afterwards create an XSLT that renders out the content of this settings item. Something like (assuming the field is called value in the setting item):
<xsl:value-of select="sc:fld('Value','/sitecore/content/settings/footerJavaScript')" />
You may or may not need to set the disable-output-escaping attribute.
Then on the aspx page that your pages use as the template add a control that looks at the xslt rendering:
<sc:XslFile runat="server" Path="/xsl/footerJavaScript" />
The reason that we normally keep the javascript as content is this allows the client to change the analytics code without having to contact us.

Resources