Drupal6: Theming Node Edit pages / Opening within Lightbox - drupal

I'm trying to display all node_edit form neatly within a lightbox without any of the excess content I don't want. No sidebars, footer, header, nothing. Just the content. So I created a page-node-edit.tpl.php file.
I have two problems daunting me, but for now I'll only mention the first since its more important.
1) From any drupal page, clicking on the "edit" link for the node doesn't activate the lightbox like it should. Instead it clicks-thru the link as normal.
With jQuery in the header I added a rel attribute for the lightbox to the links, but the box still doesn't activate. I tested the lightbox on a link I hardcoded into the page, and it activated just fine. For elements generated by Drupal, like the node edit link/button the problem seems to be timing.
I think the rel attribute needs to be built with the page, with the link, rather than appended onto it. The catch is, the link lacks an id and class, so I don't see how the hook_alter_link() function can help me.
I'm willing to try anything. Perhaps someone has done this before? Opened a node/edit form within a lightbox.
Any suggestions would be greatly appreciated.

I've seen the Modal Frame API used in a few modules (Node Relationships uses it to do something very similar to what you're doing); might be helpful...
http://drupal.org/project/modalframe

Related

no template defined wordpress masterstudy

I'm trying to do the layout of a course on masterstudy in wordpress, but I'd like to make a template for certain parts of the course, lets say for example when I hover over the title, show an image, when I click on a paragraph, make another one appear next to it etc... I think it is possible to have shortcuts for these and not have to copy paste the code each time I want to have these effects. I think this icon(see image) might do the trick (not sure) but I can't seem to save a template in my dashboard. So if it is indeed this button, can you please explain me how to save templates, and if it is not the solution can you explain me where to look ? The screenshot shows the Tiny MCE editor
Thanks screenshot

CSS gets messed up after Ajax page load

I have a website in wordpress. I recently download a plugin called Advanced Ajax Page Loader. It refreshes you content when clicked on other page without refreshing the whole site(header, footer). I tried to get my answer from plugins developer and wordpress support forum, but none responded.
I read that if ajax jquery call is used then all scripts should be reloaded again, for that the plugin have a place where I should put those codes. Until that everything works correctly, except one thin. When I go from a category to category, everything works fine, but when I open a single Post it completely screws up all my css for that page, when I refresh it, everything looks fine but then again, if I open one of the big categories with many posts, then that pages css is messed up.
I though that I could somehow refresh whole css by putting some code in the "Reload code" box, but I have no idea how to do that using scripts. English isn't my native language, therefore I'm having difficulty finding my answer on google, I tried, but my vocabulary is limited. How can I do it?
are you adding CSS classes to your elements via Javascript? If so, then the styles you add will only affect those elements which are part of the DOM at that point in time, so you might be experiencing a race condition, that actually happens to work in Chrome and Safari, but not Firefox.
second try to validate your markup and CSS and see if you have any error in your css syntax ?

JQuery Plugin (Hover-Caption) Adding Offset to Images In Internet Explorer (all versions)

I have a Wordpress site that uses a JQuery plugin called Hover-Caption ( https://github.com/coryschires/hover-caption ).
The main page of site: (http://brighidfitzsimons.com) looks good.
However in Internet Explorer 9, a similar page based on Category adds a 282px top offset to the post thumbnail image. (http://brighidfitzsimons.com/category/lifestyle/)
I am new web developer so I am struggling to figure out how to isolate problem. Based on this stackoverflow entry ( How do I get rid of an element's offset using CSS? ) my current train of thought is to add a IE specific CSS sheet to 'reverse' the offset but I can't seem to get at the offending element. Also I'm confused why works on main page but not on category page. If you watch page loading carefully, it initially loads correctly then at the very end the images are moved down. Perhaps this is a clue.
First stackoverflow entry so I hope I have followed correct ettiquete. Please advise if you need me to provide any more information.
Thanks for taking time to read problem.
Regards Simon
It has something to do with the substitutions of the content inside the title, probably some quirk about ie9 which someone else would have more of an idea for me
just so you can take my word for it: http://jsfiddle.net/BXjK3/
the first two i have removed all the greater, lesser and quotes and it works, but I would say the browser does the substitutions before Javascript can see it, and it all goes down-hill
edit: worth mentioning the reason it looks like that is because the text is no longer properly contained, and so the display none is not taking effect on it, pushing all the images down and making it a jumble, due to the way the content is loaded the ie inspection cannot show me how the text is after the javascript, only what was loaded on page load, so i can't give you more help than that

Wordpress slideshow plugin with scrollbar, autoplay and lightbox

I have been asked to build a portfolio website for a photographer. The main page contains a slideshow of the photographer's best work, I have used an autoplaying NextGEN SmoothGallery with Lytebox. After some customization of the plugin, this works.
However, the client has requested a category selection above the main slideshow and a scrollbar below the image. They also want part of the previous and next images to be visible, not just the image in focus. The image here illustrates what I mean.
I have searched and searched, but cannot find a plugin that would do this. Can anybody help, please?
The trouble is, I doubt there is a plugin around that would do this, and it's really not going to be a case of "here's the code to do that, just drop it in and you're flying".
If it were me, I'd probably write the whole thing myself, because if I'm honest, I've never used the NextGEN SmoothGallery plugin, and wouldn't want to root around all the code when I've got a simple idea myself;
A bit of PHP that outputs the list of categories, and then an unordered list of the X most recent items, one list for each category.
Then I'd use jQuery (and probably the jCarousel plugin) to create the slideshow for a single list, and add click handlers to the category links which simply 'swap in' the correct list into the current carousel.
Finish the whole thing off with some CSS.
Does any of that sound like something you'd be familiar with?

Disabling the whole page untill the loading process gets completed

I have one web page in ASP.NET and I want that page to be disabled until the whole page loading process gets completed.
One way is to activate a lightbox without content that will dim the whole page and then on the body onload event hide that lightbox.
Lightbox is a like having a modal window above the original window, and is used to preview pictures and other content. It could easy be modified to do what you want. Just activate a lightbox with no content and then hide the lightbox when the document is loaded.
This is a strange requirement and I would be interested in finding out your reason for doing this. Is there a problem or error that is ocurring. Perhaps you think the best way to prevent the error is to freeze the UI until the page loads.
I think that you should edit your question and describe what the underlying issue is. There might be a better way to improve your page.
I've seen this done with a simple overlay before.
Basically an iframe and a div that covers the page and has a high z-index is output at the beginning of page render. This is styled so it greys the page out and it also makes everything non-clickable. Then, once the page is loaded, a simple bit of javascript can be used to remove the div and iframe (or just set their styles to make them disappear).
I've also seen people attempt this issue by manually iterating over all controls on the page in JavaScript and disabling them. This is a horrible way to attempt it :)
The jQuery BlockUI plugin is another good option with lots of customization options.

Resources