I'm using context to print blocks into a region. However, I'd like to have the region print wrapper DIVs around the blocks of the given area. I know this is possible with region.tpl.php in Drupal 7. I can't seem to figure out the best way in Drupal 6.
<div class="{region classes i.e. sidebarleft}">
<div class="{block 1}"></div>
<div class="{block 2}"></div>
<div class="{block 3}"></div>
<div class="{block 4}"></div>
</div>
However, currently it prints like this:
<a id="context-block-region-right" class="context-block-region">Right Sidebar</a>
// the previous anchor tags is hidden
<div id="block-block-82" class="clear-block block block-block">
<h2>Community Navigation Block</h2>
<div class="content">
<div id="community-landing-navigation-menu">
<div class="joinCommunityBox">
<div class="community-landing-pagePanelWrapperSideBar">
<div class="community-landing-pagePanelWrapperSideBar">
<a id="context-block-block-82" class="context-block editable edit-community_contexts"></a>
</div>
</div>
I wish it would print a region wrapper tag around ALL of that...
Also, I want to keep my page.tpl.php clean of extra wrapper tags. It would be better if we could preprocess regions to print a wrapper tag.
I figured it out... The answer is actually borrowed from zen. If you click the link below, several 'preprocess functions' are rendering a new region template. Then, blocks are collected into that region, and printed.
http://www.drupal.org/node/223440#comment-5304866
It works great, and is going to go production soon.
Related
I'm trying to scrape a webpage to retrieve a piece of information I found using inspect element.
A search results page contains the following div:
<div id="se-search-serp">
...
</div>
Using inspect element, I can find the desired tags inside this element:
<div class="sc-fznyAO kChtze">
<div data-area="main" class="sc-fznKkj sc-pcxhi kVWWZA">
<h1 class="sc-qXFOy hZbUVv automation-total-books-found">500 results in Books</h1>
<div class="sc-pQfvp hBInHv">
<div class="sc-qXHHN kITAEN"><ul id="search-results-tabs" role="tablist" data-test="tabs" class="sc-pAyMl frsGKv">
<li role="presentation">
<a role="tab" id="search-results-tabs_tabheader_0" data-test="search-results-tabs_tabheader_0" href="#search-results-tabs_tabpanel_0" data-index="0" tabindex="-1" class="sc-pITNg jukMUo">All Matches</a></li>
...
I would like to access this content through the Python Requests library. However, when I request the page and print out the text, the contents of this div are missing. Here's the string of relevant text in the very long output:
...
<div id="se-search-serp"></div>
...
I have checked that this is the div that contained the content in expect element. It has the same place in the hierarchy and no other divs of the same id exist on the page.
What is going on here? I've observed that many of the tags within <div id="se-search-serp"> belong to classes with illegible names ("sc-fznyAO","sc-qXFOy", etc.)like the ones shown above. I cannot find any tags like these in the printed page text, although they do show in inspect element. Could this be relevant?
And finally, is there any way to access this content through the requests library?
Edit: The site url I am using is: https://www.chegg.com/search/the%20art%20of%20electronics/#p=1
I have this bit of code:
<div class="kt-portlet__head">
<div class="kt-portlet__head">
<div class="kt-portlet__head-label">
<span class="kt-portlet__head-icon">
<i class="la la-user"></i>
</span>
<h3 class="kt-portlet__head-title">
Edit User
</h3>
</div>
</div>
</div>
The content changes across the project, ie, everything within the div with the class kt-portlet__head-label
I need to remove the duplicate wrapper div (i.e, you will see there are two div tags with class kt-portlet__head).
To my knowledge:
I cannot do a search and replace because searching for just the two open wrapper tags and replacing with one will leave two div close tags instead of one.
I cannot do a search and replace on the whole thing because the content changes as stipulated above
I can use 'code wrap/unwrap' on an open document - but this is manual and i might as well just delete the two lines individually.
Isn't there a way to do a kind of 'code unwrap' + search and replace to get this achieved?
Using this library Angular File Upload I'm trying to make nested dropzones but running into an issue with dragleave events.
<div class="full-area">
<div class="outer-dropzone">
<ol>
<li>
<div class="container">
<div class="drop-zone-inner"></div>
<div class="align"> </div>
<div class="align"> </div>
</div>
</li>
</ol>
</div>
</div>
What I want to achieve is something along the lines of the follow:
When dragging into the browser window and the .outer-dropzone is entered it changes css (background color yellow for example).
If you drag onto .drop-zone-inner it reverts the .outer-dropzone then changes the drop-zone-inner to a new css background.
Third if you leave .drop-zone-inner it re-applies the .outer-dropzone css change.
The issue I'm having is if I have several items in the .drop-zone-inner field (i.e text and image etc). It causes flashing in where it tries to unapply the drop-zone-inner and repply the outer-dropzone.
I've tried a lot of different setups and layout, but I'm not sure the best way to actually approach this.
Edit: Basically I'm trying to accomplish something similar to Dropboxs dropzone highlights
I have a section of HTML that I would like to be editable with CKEditor but in 2 different pieces.
Ideally I would want my HTML to look like:
<div class="page-header">
<h1>
<span>Heading</span>
<small>Subheading</small>
</h1>
</div>
where the subheading would be displayed on the same line as the heading and each are editable separately. This looks fine without CKEditor enabled.
One attempt was to hack the editor to enable span and small tags: (Enable CKEditor4 inline on span and other inline tags)
CKEDITOR.disableAutoInline = true;
CKEDITOR.dtd.$editable.span = 1;
CKEDITOR.dtd.$editable.small = 1;
$("[data-allowed-formating='all']").ckeditor();
http://jsfiddle.net/OzzieOrca/PCH9z/1/
This mostly works but if you double click the Header (to select everything) and start typing, it deletes the subheading and you can't get it back until you refresh the page
I tried using <div style="display: inline"> instead of the small and span but when CKEditor is instantiated, it changes the styling of the div and the subheader drops below the header.
I will try see if there is anything else I can do with CKEditor or see if I have any other HTML layout or styling ideas but any suggestions would be appreciated.
(I had the same issue with TinyMCE so I tried CKEditor and I think I like it better so I decided to keep using it but I still have this same problem)
Edit:
I finally tried this:
<div class="page-header">
<h1 class="pull-left">Header</h1>
<h1 class="pull-left">
<small class="padding-left">Subheader</small>
</h1>
<div class="clearfix"></div>
</div>
but then realized that this wouldn't wrap the subheader but just moves it to a new line if it is too long. I submitted this bug report: http://www.tinymce.com/develop/bugtracker_view.php?id=6354 which includes this example of what I want to do and what is not working http://jsfiddle.net/OzzieOrca/jKmZ7/
First, make sure the editor doesn't attach itself to the <h1> element.
If that works correctly, then I suggest to wrap the elements that you want to edit in a block element during edit and restore the DOM when editing stops.
I don't know why CKEeditor might distinguish between inline and block elements but it's quite possible that it never occurred to the author that someone might want to edit only part of a block.
I am using the DNN MobiNuke Module (v02.00.03) from DataQuadrant to create a mobile version of a website I have created. Everything is going well EXCEPT a weird issue I am running into with the Mobile Skins. I have a simple Mobile Skin that looks like this:
<div id="mobile_frame">
<div id="mobile_header">
...
...
</div>
<div id="main_wrap">
<div id="mobile_main" class="sub">
<div id="ContentPane" runat="server"></div>
</div>
</div>
<div id="mobile_footer">
...
...
</div>
</div>
The issue that is arising is that ANY content in the ContentPane that has an empty div tag will change itself when rendered in a mobile browser:
<div class="xxxx"></div>
Will change itself to
<div class="xxxx" />
The biggest problem that this is causing is that the browser is interpreting the tag as an opening div tag with no closing tag. Therefore it is placing an ending div tag essentially wherever it wants. It's causing ALL of the markup after this area to get very messed up.
Here is an example of the code as it should be, and how it is rendering on the page:
Should be:
<div id="main_wrap">
<div id="mobile_main" class="sub">
... Content Here ...
</div>
</div>
<div id="mobile_footer">
...
</div>
</div>
But it renders as:
<div id="main_wrap">
<div id="mobile_main" class="sub">
... Content Here ...
</div>
<div id="mobile_footer">
...
</div>
</div>
</div>
I can fix this in the markup that I have control of by putting inside of the tags, but I do not have the time/energy to go through EVERY module that might be showing up in the ContentPane to check for empty tags. In addition, there are places where I want an empty tag to fill it with content later with javascript.
Lastly, I did a TON of research to look this up and I cannot find a thing. The closest that I found is that this happens in XSLT when transforming some XML, but as far as I know MobiNuke is not doing that.
Any help is greatly appreciated. Thanks!
I have figured out the issue after having a discussion with the vendor. There is a setting in the module settings called "Enable content adaptation". Apparently the setting will try to make the HTML to be XHTML compliant, but it was definitely not working for me. Hope this helps anyone else seeing this.