"Quick Read" mit thickbox oder lightbox?
Eingetragen von jonas28@drupal.org (96)am 21.08.2007 - 18:49 Uhr in
Schaut mal auf die folgende Website http://www.huffingtonpost.com/
Da gibt es eine "Quick Read"-Funktion, die ich sehr interessant finde. Hat jemand eine Ahnung ob sowas auch mit irgendeinem Drupalmodul möglich ist?
Ich benutze derzeit das Modul "thickbox" um diesen Effekt bei Bildern zu erhalten. Ich würde aber gerne auch anderen Content dort einbinden.
Gruß
Jonas
- Anmelden oder Registrieren um Kommentare zu schreiben
Das ist mit dem JQuery
am 21.08.2007 - 18:52 Uhr
Das ist mit dem JQuery Plugin Thickbox definitiv möglich, weiss aber nicht ob die Drupal Implementierung das unterstützt.
vg
--
sanduhrs · Stefan Auditor · Drupalcenter
---------------------------------------------------------------------
http://erdfisch.de · http://audiens.de · http://drupal.org/user/28074
ja, das geht, aber
am 21.08.2007 - 21:15 Uhr
Hi,
das habe ich schon hinbekommen mit der Thickbox, aber ich weiß leider nicht wie man das Menü und so abstellen kann, wenn der Link mit Thickbox zu sehen unter http://demo.holzwurm-page.com/award/goldawar.htm ((DEMOSEITE)auf die erste Laudatio klicken), aber ich weiß noch nicht wie man es macht das nur der Text von der Laudatio angezeigt wird, sonst geht es.
Weiß da einer zufällig ein Modul oder Hack für so etwas???
MfG
Michael Finger
Holztechniker
Ich würde dazu ein kleines
am 21.08.2007 - 21:48 Uhr
Ich würde dazu ein kleines einfaches Modul machen:
hook_menu implementieren und dann dort einen pfad angeben.
jeder link mit mit quick read bekommt ein tag z.B.
<a href"" class="qr">, so kann mit jquery die funktionalität hinzufgefügt werden, dass es so ein Fenster aufmachen soll.callback des definierten menu item wird dann aufgerufen und dort wird die entsprechende ausgabe gemacht.
Habe leider gerade keine Zeit für genauere Ausführungen und weiss auch nicht genau, ob die Lösung funktioniert, aber ich bin im Moment ziemlich intensiv am JQuery/Drupal/Ajax machen und habe da unter anderem so etwas ähnliches gemacht. Bei mir war jedoch lediglich ein statischer Inhalt, welcher aufgerufen wurde, so musste ich mich nicht um eine entsprechende Parameterübergabe kümmern.
Vielleicht hilft es ja ein wenig oder gibt wenigstens schon mal eine Ansatzlösung.
___________________________
it's easier than you think
Raphael Schär
http://www.schaerwebdesign.ch
Greybox Redux
am 21.08.2007 - 21:49 Uhr
Hallo Michael,
vielleicht hilft dir das Modul "Greybox Redux" (findet man unter: http://drupal.org/project/greybox)
Aus der Modulbeschreibung: "[Greybox Redux]is used to display web sites on top of your current page[...]
gruß
Jonas
Mmhh, mit der Thickbox
am 22.08.2007 - 06:24 Uhr
Hi Jonas,
mit der Thickbox kann man mehr machen, schau mal unter http://jquery.com/demo/thickbox/ als mit der greybox.
Hi Raphael,
leider kann ich dir nicht ganz folgen und ich habe leider keinen statischen Inhalt, sondern alles in Drupal drin.
hi alle,
ich dachte ja schon daran das Druckmodul umzuschreiben, aber dann habe ich das Problem, das der Link auch umgeschrieben werden müßte wenn JavaScript on ist, damit es ohne Navi erscheint in der Box und wenn JavaScript off ist mit Navi erscheint.
Aber leider habe ich das noch nicht so ganz verstanden wie das geht mit den Modulen und von daher suche ich eigendlich so ein Modul.
MfG
Michael Finger
Holztechniker
Das mit den dynamischen
am 22.08.2007 - 06:46 Uhr
Das mit den dynamischen Inhalten ist dann eigentlich kein Problem mehr. Javascript müsste irgendwie wie folgt aussehen:
<a href="javascript:quick_read('node/4')">Quick Read</a>
function quick_read(){
ajax_call. node/4 holen und im Thickboxfenster anzeigen
}
Serverseitig:
<?php
function hook_menu(){
$items[] = array(
'path' => 'mein_modul/get_content/'.arg(2),
'callback' => 'get_content',
'access' => user_access('access mein modul'),
'type' => MENU_CALLBACK,
'callback arguments' => array('id' => arg(2)),
);
}
function get_content($id){
die entsprechenden Node Funktionen, um den Node auszugeben.
...
print $out;
}
?>
Was ich jedoch gerade nicht weiss, wie es klappen könnte, wie du den javascript Link hinbekommst.
___________________________
it's easier than you think
Raphael Schär
http://www.schaerwebdesign.ch
In phpCMS geht es so
am 22.08.2007 - 07:57 Uhr
Hi Raphael,
in phpCMS habe wir das schon mal gelöst und das kann man sich anschauen unter http://www.holzwurm-page.de/Award/goldawar.htm
Vorteil bei der ganzen Sache ist, ist JavaScript off, kommt der Nutzer auf eine Seite und kann sogar navigieren.
Das JavaScript sieht dafür so aus um Link zu ändern:
function getBody() { return getElementsByTagAndClassName('body')[0] };
function getElementsByTagAndClassName(tag_name, class_name, /* optional */parent) {
var class_elements = new Array();
if(parent == null || parent == "undefined")
parent = document;
if(tag_name == null || tag_name == "undefined")
tag_name = '*';
var els = parent.getElementsByTagName(tag_name);
var els_len = els.length;
var pattern = new RegExp("(^|\\s)" + class_name + "(\\s|$)");
for (i = 0, j = 0; i < els_len; i++) {
if ( pattern.test(els[i].className) || class_name == null ) {
class_elements[j] = els[i];
j++;
}
}
return class_elements;
}
//Umwandeln von href
function changeLinks() {
var links = getElementsByTagAndClassName("a", "lbOn");
for (i = 0; i < links.length; i++) {
// ist da schon ein ? im Link, wenn ja dann muss man ein & verwenden
if(links[i].href.match(/\?/)){
links[i].href = links[i].href + "&";}
else{
links[i].href = links[i].href + "?";}
links[i].href = links[i].href + "template=/template/thema.tpl";
}
}
// addLoadEvent()
// Adds event to window.onload without overwriting currently assigned onload functions.
function addLoadEvent(func)
{
var oldonload = window.onload;
if (typeof window.onload != 'function'){
window.onload = func;
} else {
window.onload = function(){
oldonload();
func();
}
}
}
addLoadEvent(function(e) {
changeLinks();
});
Aber phpCMS arbeitet mit Templa Dateien und die kann man sich unterschiedlich aufbauen.
MfG
Michael Finger
Holztechniker
Aber dann ist es doch kein
am 22.08.2007 - 13:09 Uhr
Aber dann ist es doch kein Problem. Oder sehe ich etwas falsch. Also es müsste wohl in einem neuen Modul gemacht werden. Der Link wird entsprechend angepasst:
<a href="node/8" onClick="quick_read('node/8');return false;">Node 8</a>Die Funktion quick_read holt per Ajax den Inhalt, macht das Unsichtbare Div sichtbar und stellt den Text da rein und macht den Hintergrund dunkel. Falls js off ist, dann würde es normal zum Node 8 gehen.
Ich hoffe es hilft. Obs da wohl noch kein Modul gibt, was so etwas macht?
___________________________
it's easier than you think
Raphael Schär
http://www.schaerwebdesign.ch
Mal was probiert
am 22.08.2007 - 15:00 Uhr
Hi Raphael,
ich habe das jetzt mal anders ausprobiert mit dem Druckmodel, der 2 Link "Laudatio von Hexenmaus" ist so aufgebaut. Das sieht schon fast so aus. Jetzt müßte es nur so sein das wenn JavaScript off ist die normale Seite mit Navi erscheint, aber das tut es noch nicht.
Also ich habe bis jetzt noch nichts gefunden, weder unter drupal, noch hier auf den Seiten und bei Google hatte ich auch keinen Erfolg als Suche habe ich "drupal Thickbox Nodes" genutzt.
MfG
Michael Finger
Holztechniker
Wo ist das
am 22.08.2007 - 17:31 Uhr
Wo ist das Beispiel?
___________________________
it's easier than you think
Raphael Schär
http://www.schaerwebdesign.ch
Das Beispiel von Michael
am 22.08.2007 - 18:57 Uhr
findet man wie oben erwähnt unter http://demo.holzwurm-page.com/award/goldawar.htm
Die Seite hat sich nur heute im Laufe des Tages ein wenig geändet...
@Michael: Ich war gerade eben noch mal auf der Site und es sieht so aus, als ob es geklappt hat.
Ne leider nicht ganz
am 22.08.2007 - 20:15 Uhr
Hi jonas,
leider geht es nicht richtig, der Link "Laudatio von Hexenmaus ist statisch und nicht über JavaScript geändert.
Statisch soll der Link wie folgt aussehen:
award/hexymaus.htm
Wenn JavaScript on ist sollte er mal so aussehen:
/printable/node/262?height=300&width=300
Und im Moment nutze ich auch noch das Druckmodul, was ja eigendlich nicht dafür gedacht ist. Ich habe ja noch die Hoffnung, das es eine einfachere Lösung gibt, aber ich habe mich schon durchs Netz gewühlt und leider nicht das passende gefunden.
MfG
Michael Finger
Holztechniker
Umweg übers Modul "Print Friendly Pages"
am 25.08.2007 - 12:03 Uhr
So,
ich habe jetzt auch mal den Umweg von Michael über das Modul "Print Friendly Pages" (http://drupal.org/project/print )ausprobiert.
Dann habe ich hinter jeden Link noch mal /print drangehängt und die class greybox hinzugefügt.
Beispiel:
Straßen und Schienen wirken als <a href="/node/2/print" class="greybox">anthropogene</a> Barrieren für Menschen und Tiere, für Pflanzenausbreitungen, aber auch für Grundwasser- oder Luftströmungen.Das funktioniert auch soweit erstmal... Ich werde damit jetzt mal weiter rumprobieren und meine Erfahrungen hier posten.
Gruß
Jonas
Ah, das war es
am 25.08.2007 - 22:54 Uhr
Hi Jonas,
das war es was ich gesucht habe, mit dem printmodul geht es so wie ich mochte.
Bis auf einen kleinen Fehler, man muß node/2 angeben und nicht verzeichnis/Dateiname.htm, damit geht es leider nicht, kann man auf der Demoseite testen, jetzt brauche ich da Printmodul nur noch ein wenig anpassen und es müßte sowohl mit javaScript gehen, als auch ohne JavaScript gehen.*freu*
MfG
Michael Finger
Holztechniker
Anpassung von "Print Friendly Pages"
am 26.08.2007 - 12:27 Uhr
Szeanriobeschreibung:
Ich habe zwei Inhaltstypen, Artikel und Glossareintrage.
Innerhalb der Artikel sind die Gloassareinträge verlinkt.
Eine Kurzversion des Glossareintrages soll bei einem Klick auf den Link in einer "greybox" angezeigt werden. Innerhalt der Greybox soll es die Möglichkeit "ganzen Glossareintrag lesen" geben.
Dazu habe habe die Datei im Modul "Print Friendly Pages" mitgelieferte Datei print.node.tpl.php folgendermaßen angepaßt
Orginal:
<body>
<?php $node->logo ? print '<img src="'.$node->logo.'" alt="logo" border="0" />' : '';?>
<div class="source_url">
<?php variable_get('site_name', 0) && print t('Published on').' '.variable_get('site_name', 0).' ('.l($base_url, $base_url).')'; ?>
</div>
<h2 class="title">
<?php print $node->title; ?>
</h2>
<div class="submitted">
<?php print theme_get_setting("toggle_node_info_$node->type") ? t('By').' '.$node->name : ''; ?>
</div>
<div class="created">
<?php print theme_get_setting("toggle_node_info_$node->type") ? t('Created').' '.format_date($node->created, 'small') : '' ?>
</div>
<div class="content">
<?php print $node->body; ?>
</div>
<hr size="1" noshade />
<div class="source_url">
<?php print '<strong>'.t('Source URL:').'</strong><br /><a href="'.$node->source_url.'">'.$node->source_url.'</a>'?>
</div>
<div class="pfp-links">
<!-- Output printer friendly links -->
<?php $node->pfp_links ? print '<p class="links"><strong>'.t('Links:').'</strong><br />'.$node->pfp_links.'</p>' : ''; ?>
</div>
<div class="footer">
<!-- Add your custom footer here. -->
</div>
</body>
Nachher:
<body>
<h2 class="title">
<?php print $node->title; ?>
</h2>
<div class="content">
<?php
print $node->teaser;
print '<a href="'.$node->source_url.'" target="_parent">[...] </a>';
?>
</div>
<hr size="1" noshade />
<div class="source_url">
<?php print '<strong>'.t('Den kompletten Artikel gibt es unter:').'</strong><br /><a href="'.$node->source_url.'" target="_parent">'.$node->source_url.'</a>'?>
</div>
</body>
Das funktioniert wie oben beschrieben, allerdings ist der Inhalt in der Greybox noch nicht an mein CSS angepasst. Dafür habe ich noch unter admin/settings/print die Stylesheet URL angegeben und die entsprechende Datei print.css an mein Design angepasst.
Anzeigeproblem mit Greybox
am 26.08.2007 - 12:57 Uhr
So sieht es derzeit aus... das entspricht schon fast meinen Wünschen...
leider sieht es so aus wenn man mit dem browser schon innerhalb der Webiste runtergescrollt hat. Der graue Hintergrund der Greybox bricht ab:
@Michael:
Ich habe mal wieder bei Dir geluschert und habe bemerkt, dass dieses Problem bei Dir nicht austritt. Haste da nen Tipp für mich?
Gruß Jonas
weiteres Anzeigeproblem mit Greybox
am 26.08.2007 - 13:18 Uhr
@Michael:
Außerdem wird mein Text nicht korrekt dargestellt, er verschwindet rechts in der greybox.
Da scheinst Du auch inzwischen eine Lösung zu haben.
Gruß Jonas
Solche Probleme hatte ich nicht
am 26.08.2007 - 14:05 Uhr
Hi Jonas,
saolche Probleme habe ich nicht mit der Thinkbox, da ging das einfach ohne das ich was dazutun mußte.
Leider kann ich dir zu der Greenbox nichts sagen, da ich die noch gar nicht getestet habe, da ich wuste das es eigentlich nur mit der Thinkbox gehen kann.
Michael Finger
Holztechniker
Es klappt jetzt auch bei mir
am 26.08.2007 - 15:32 Uhr
Ich habe mich nach deinem Kommentar, noch mal an thickbox rangesetzt:
und habe mir von der Website http://jquery.com/demo/thickbox/
die passenden Befehle besorgt.
z.B.:
<a href="/node/53/print?keepThis=true&TB_iframe=true&height=200&width=620" title="Emissionen" class="thickbox">Emissionen</a>Es funktioniert. Danke
bessere lösung?
am 06.12.2007 - 15:12 Uhr
nachdem ich mir den Thread quergelesen habe möchte ich die Frage stellen, ob es nicht auch möglich ist, andere inhalte als nodes darzustellen. Ich denke an einen link im Profil, der einen Popup für Privatemessages (pfad: privatemsg) aufmacht. ("so wie im Studivz" <-- höre ich öfter derzeit).
ginge das auch?
lg
b
jaein
am 06.12.2007 - 16:46 Uhr
Hi derBen,
das Problem ist das Drupal mit 2 arten von Links arbeitet, einmal "node/234" und einmal mit "demo/meineseite.htm."
Jetzt brauchst du um mit Drupal als normalen Link zu arbeiten, wenn JAVASCRIPT abgeschaltetalso folgenden LInk =>>"demo/meineseite.htm"
Wenn du es aber über eine der print Module lösen möchtest und JAVASCRIPT iston brauchst du folgenden LINK damit es geht =>>"demo/thikbox/234?b=200&h=300"
Von daher habe ich die Sache im Moment erst mal Ruhen gelassen, weil ich noch nach einer besseren Lösung gesucht habe, die einfacher zu handhaben ist, weil die jetztige Lösung ist nicht gerade einfach in der Handhabung.*heul*
Michael Finger
Holztechniker
danke!
am 06.12.2007 - 17:08 Uhr
ich denke mal, das wir nicht die einzigen sind, die eine solche funktion gerne hätten. ich halte auf jeden fall mal die augen offen - vielleicht gibts irgendwo jemanden der eine gute Lösung hat und ein modul draus backen kann.
der umweg über das print-modul gefällt mir irgendwie nicht :(
--
Freiwilligendienst Community
Also ich denke
am 06.12.2007 - 17:15 Uhr
Hi derBen,
man wird gar kein neues Modul brauchen, sondern nur phptemplate und thikbox richtig einsetzen müßen, damit das geht.
Aber ich komme mit der Seite http://drupal.org/phptemplate leider nicht so gut zurecht, da ich es mir immer erst ins deutsche Übersetzen muß. Aber ich bin der Sache schon sehr auf der Spur. Aber ich freue mich wenn du eine bessere Lösung findest und hier posten würdest. 4 Augen sehen mehr wie 2.
MfG
Michael Finger
Holztechniker