jDownloads Support Forum

Older Versions => jDownloads 3.2 (Support ended) => Topic started by: ABraker on 25.11.2015 20:59:27

Title: Layout Fronend [solved]
Post by: ABraker on 25.11.2015 20:59:27
Hallo,

mein Template beinhaltet einen dunklen Hintergrund, so dass einige backgrounds nicht richtig dargestellt werden.
Wo kann man das Layout für einen dunklen Hintergrund einstellen oder den background-color:#EFEFEF;  auf background-color:none ändern?
In der Layout css konnte ich diese Einstellung nicht finden und Änderungen an der custom.css zeigen keine Wirkung.
Kann jemand helfen?
Um folgende Website handelt es sich: http://braker.eu/index.php/support/downloads

Vielen Dank.
Gruß
Title: Re: Layout Fronend
Post by: Arno on 26.11.2015 00:32:21
Hallo,
gehe zu Layouts und dann auf Details Layouts.
Öffne dann das in der Liste als "aktiviert" markierte Layout und ändere es wie gewünscht ab (siehe pic).

Zur Zeit arbeiten wir an komplett überarbeiteten und auch neuen Layouts (unter anderem auch für dunkle Templates). Diese werden vorrausichtlich im Januar vorgestellt. Zur einfacheren Installation wird die nächste Version (kommt in den nächsten Tagen) bereits eine Import- und Export Funktionen für Layouts verfügen.

[gelöscht durch Administrator]
Title: Re: Layout Fronend
Post by: ABraker on 26.11.2015 11:24:41
Hallo,

vielen Dank für die schnelle Rückmeldung. Hat wunderbar geklappt!
Auf dieser Seite habe ich jedoch selbes Problem und kann die Quelldatei ebenfalls zur Änderung nicht finden:

http://braker.eu/index.php/support/downloads/uncategorised

Wo kann ich hier den Quellcode anpassen?

Danke für die Unterstützung.

Gruß
Title: Re: Layout Fronend
Post by: Arno on 26.11.2015 11:47:37
QuoteWo kann ich hier den Quellcode anpassen?
Wie zuvor, nur musst du nun das Dateien Layout aufrufen.
Title: Re: Layout Fronend
Post by: gerdon on 06.05.2016 14:28:52
Hallo,
ich muss das Thema noch mal hochholen.
Ich binde in einen Artikel über {jd_file file==xxx}einen Link ein.
Dieser sieht dann aus wie im Anhang.
Ich möchte das Layout anpassen, kann die Datei aber nicht identifizieren. Offensichtlich passt keine Layout-Datei in JDownloads --> Layout zum Quellcode. Modifikationen werden auch nicht übernommen.
Suche ich an der falschen Stelle?
Gruß
gerdon

[gelöscht durch Administrator]
Title: Re: Layout Fronend
Post by: Arno on 07.05.2016 09:58:54
Hi,
QuoteIch binde in einen Artikel über
Code: [Auswählen]
{jd_file file==xxx}
einen Link ein.
Du verwendest in dem Fall also das Content Plugin.
Auf dem letzten TAB in der jD Konfiguration kannst du einstellen, welches (Dateien) Layout dafür standardmäßig verwendet werden soll. Das Layout was hier ausgewählt wird muss nicht zusätzlich in der Liste der Dateien Layouts aktiviert sein, da es in dem Fall ja nur für das Plugin verwendet wird. Du kannst aber auch ein neues Layout nur für das Plugin erstellen oder ein bestehendes ändern.

Zusätzlich besteht die Möglichkeit, ein bestimmtes Layout direkt im Plugin Platzhalter festzulegen. Siehe Beispiele hier:
http://www.jdownloads.net/documentations/item/overview-and-installation-notes-for-jdownloads-plugins

Title: Re: Layout Fronend
Post by: ColinM on 07.05.2016 16:49:28
Hi
Two layouts you might find useful with the Content plugin are Files Layout Single Line v3.2 or Files link only v3.2
Colin
Title: Re: Layout Fronend
Post by: gerdon on 09.05.2016 10:37:27
Ok, die Seite für das Plugin hatte ich nicht auf dem Schirm. Ich war nur auf der Seite "Layouts" und ließ mich von der Angabe des aktiven Layouts blenden.
Ich habe mir nun ein eigenes Layout gebastelt, welches ausschließlich nur folgenden Code hat:
{file_pic}{file_title}
Das funktioniert auch soweit ganz gut, nur nicht, wenn ich es z.B. in eine Liste einbette. Dann sieht das im IE11 so aus: (http://webdon.de/liste_IE11.JPG) und im Firefox so: (http://webdon.de/liste_Firefox.JPG).
Das ist so natürlich nicht akzeptabel.
Im Quellcode sehe ich dass in jedem Listenpunkt der Link in ein <div> eingebettet ist. Die dazugehörende CSS-Klasse kann ich nicht finden. Ich weiß auch nicht, ob das der Grund für das seltsame Listen-Layout ist.
Gruß
gerdon
Title: Re: Layout Fronend
Post by: ColinM on 09.05.2016 17:34:01
Hi
Which version of jDownloads are you using?  You need to be at least at v43 but v44 would be better. 
The CSS class "jd_files_oneline" is in jdownloads_fe.css and it will be picked up automatically
You do need the surrounding <div class="jd_files_oneline"> ...  </div>

As from jD v43 you can import and export layouts as xml files.  So I have exported a simple layout that just shows the file icon and file title as a link. This is in the attached zip file "exported_layout_jd_3.2.44_Files_link_and_icon_v3.2.xml.zip" so please extract the file "exported_layout_jd_3.2.44_Files_link_and_icon_v3.2.xml" and then use the Layout import to upload from your PC

The first pic below shows the result when the 'code' in my article was as shown in the second  pic.

Colin

[gelöscht durch Administrator]
Title: Re: Layout Fronend
Post by: gerdon on 12.05.2016 13:51:07
I use now version 3.2.43.
It creates this DIV: <div class="jd_content jd_content_plugin">.
There is no Text with "jd_files_oneline".
Title: Re: Layout Fronend
Post by: ColinM on 12.05.2016 16:57:10
Hi
Did you import the layout OK?  You do need to select it either by using Config - Plugin tab and selecting the default layout for use with the Content plugin or by
{jd_file onlinelayout==Files link and icon v3.2}
{jd_file file==nn}
where nn is the id of the download.  You do not need to repeat the onlinelayout bit if you have several  Downloads in the article, but it obvious is needed before the first one.

Colin
Title: Re: Layout Fronend
Post by: gerdon on 13.05.2016 07:51:28
Ok, i did as you described. But the result doesn't changes in Firefox.
This is the Code:<p>{jd_file onlinelayout==Files link and icon v3.2}</p>
<div>
<ul>
<li>{jd_file file==2}</li>
<li>{jd_file file==3}</li>
<li>{jd_file file==4}</li>
</ul>
</div>
and this is the source text:<ul>
<li><div class="jd_content jd_content_plugin">


<div class = "jd_files_oneline" style=""><a href="....

There is still the class "jd_content jd_content_plugin".
Your example didn't contain the ul and li-tags. So please test the code with a list.
gerdon
Title: Re: Layout Fronend
Post by: ColinM on 13.05.2016 11:51:03
Hi
First the code line
<div class="jd_content jd_content_plugin">
is generated by the plugin itself for each instance of {jd_file file==nnn}

In my test article the text is like that shown in pic layout03.png
The html cde in the article is
<p>{jd_file onlinelayout==Files link and icon v3.2}</p>
<p>{jd_file file==25}<br />{jd_file file==31}<br />{jd_file file==65}<br />{jd_file file==5}</p>

The result on the screen is shown in pic layout04.png
The code generated for each {jd_file file==nnn} becomes something like

<div class="jd_content jd_content_plugin">
  <div class="jd_files_oneline" style="">
     <a href="/list-all-cats/download/9-topcat-sub1/25-http-www-decorative-coving-co-uk-products">
      <img src="........images/jdownloads/fileimages/pdf.png" alt="" align="top" border="0" height="32" width="32"></a>
     <a href="/list-all-cats/download/9-topcat-sub1/25-http-www-decorative-coving-co-uk-products">decorative-products  For Uploaders</a>
  </div>
</div>
<br />


From your response I presume you are seeking to have the links in an unordered list.
So that in the editor it looks like pic layout05.png
and in htmlcode as
<p>This is start of a list&nbsp; {jd_file onlinelayout==Files link and icon v3.2}</p>
<ul>
   <li>{jd_file file==25}</li>
   <li>{jd_file file==31}</li>
   <li>{jd_file file==65}</li>
   <li>{jd_file file==5}</li>
</ul>
<p>End of list</p>


Without any extra CSS this creates a very, very messy layout.  So you need to add the following css into jd_custom.css
.jd_content_plugin {
    float: none;
    display: inline-block;
    clear: none;
}

The css class jd_content_plugin was introduced into jDownloads v44 specifically to allow solutions such as above.  In fact in the  next release I fully anticipate that the above css will be there by default.  It actually "undoes" some of the setup needed in the main views but which is a nuisance in the plugin.

After adding in the above css it gives a screen view as shown in pic layout06.png which I think is what you want.
Colin

[gelöscht durch Administrator]
Title: Re: Layout Fronend
Post by: gerdon on 23.05.2016 07:43:11
Hello,
now back from holiday, but the Problem still exists.
With the "jd_custom.css" i can modify the list, so it works fine. Thank you for that.
But when I place the link in a sentence, the automatic created div-layer places a new line.
Code:Nun folgt ein Link ({jd_file file==4}) innerhalb eines Satzes.
Shown text: (http://webdon.de/zeilenumbruch.JPG)
Source code:<p class="zeile">Nun folgt ein Link (<div class="jd_content jd_content_plugin"><a href="/component/jdownloads/send/3-xxx/4-geschuetzte-datei.html"><img src="https://www.joomla.webdon.de/images/jdownloads/fileimages/pdf.png" align="top" width="20" height="20" border="0" alt="" /></a><a target="_blank" href="/component/jdownloads/send/3-xxx/4-geschuetzte-datei.html" title="Download" class="jd_download_url">Geschützte Datei</a>
</div>) innerhalb eines Satzes.</p>

Is this div-layer really necessary?
Title: Re: Layout Fronend
Post by: ColinM on 23.05.2016 22:15:55
Hi
Yes the div layer is essential.  I do have an update to the CSS to avoid the new lione.  This will come with the next release but in the meantime I have attached the latest CSS for jdownloads_fe.css.  The attached zip contains a file called jdownloads_fe-MASTER.css which you need to rename as jdownloads_fe.css and overwrite the existing version.
If you send me a private message (click on square blob under my name) with super admin access I can load it for you and check out the css.

Colin

[gelöscht durch Administrator]
Title: Re: Layout Fronend
Post by: gerdon on 08.06.2016 07:45:33
Sorry, it does'nt works. Nothing changed.  :-[
Title: Re: Layout Fronend
Post by: ColinM on 08.06.2016 13:31:06
Hi
Which editor are you using?  If for example it is JCE or ARKeditor then the default styling is Paragraph(JCE) or Normal(ARK) and this is causing the problem.

EDIT The <p> tag is for a paragraph and as such it is defined as a block element. The <div> tag is a container element.  In the same way as one would not put a <p>  element in another <p> element  (paragraph in a paragraph!!) then one cannot put a <div> in a <p> element.  But one can put one or more <p> elements in a <div>.

As an example I put the same 'line' in the editor twice, once when editor is in Paragraph[Normal] mode and the second time when in div[Normal(Div)] mode.
Pic 'Single line layout02.png' shows the lines when in the Editor., and Pic 'Single line layout03.png' shows the results.
So ensure you use div mode in the editor when inserting the content plugin.  The code generated is shown below. Will need to add caution to documentation.

Colin

JCE Code generated when Editor in 'paragraph' mode NB contents of the 'a' tags deleted
<p>Now display in the middle </p>
<div class="jd_content jd_content_plugin">
  <div class="jd_files_oneline" style="">
    <a href=.....></a>
    <a href=...>decorative-products  For Uploaders</a>&nbsp;
  </div>
</div>
of a sentence.  The important aspect is to ensure the Editor type is set to a  div
<p></p>


JCE Code generated when editor in div mode 
<div>Now display in the middle
  <div class="jd_content jd_content_plugin">
    <div class="jd_files_oneline" style="">
       <a href=....></a>
       <a href=....>decorative-products  For Uploaders</a>&nbsp;
    </div>
  </div> of a sentence. The important aspect is to ensure the Editor type is set to a  div
</div>


[gelöscht durch Administrator]
Title: Re: Layout Fronend
Post by: gerdon on 09.06.2016 08:17:55
Perfect! Thank you for that. Now it works fine.  :)