layout (4) Four rows horizontal sub-categorie

[DannyBranderhorst]

Dear co-users,

I myself have been searching and trying for quite some time how to get not a single vertical row of sub-categories, but rather distributed across the screen in 4 or 5 rows horizontal and vertical.

All information is welcome.

Below an example of how I would like to have this:
https://imgur.com/a/Dm9ZJiG

Version: Phoca Download (latest one)

[DannyBranderhorst]

Anyone, tips and tricks how I can do this?

[christine]

Hi,

Example from demo: https://www.phoca.cz/joomla3demo/phoca-download-demo

Code: Select all

#phoca-dl-categories-box div.pd-categoriesbox {
    width: 28%;
    position: relative;
    float: left;
    margin: 1%;
    padding: 1%;
}

e.g. width etc. If you for instance, delete temporary the: float: left, than it becomes vertical.

Maybe we could say more, if we can see it live. (which template?)

Kind regards
Christine

[DannyBranderhorst]

Hello Christine,

Many thanks for the quick reply. I will test something with your comments. After that sharing this what my results are, personally I don't have a lot experience so all the information are really welcome. We keep in touch... Greetingz Danny.

[DannyBranderhorst]

Dear super programmers of the world,

I would especially like to thank Christine (and of course Jan) for her tip. I managed to get not one long vertical row of subfolders underneath each other but a number of them next to each other. This tip of yours Christine was the right one, will also added pictures and link to see what I have adjusted.

\...\media\com_phocadownload\css\main\phocadownload.css

Code: Select all

#phoca-dl-categories-box .pd-subcategory, #phoca-dl-category-box .pd-subcategory {
    padding-left: 57px;
    height: 15px;
    background: #e3171700 url(../../images/folder-oxygen-yellow4949.png) 2px no-repeat;
    width: 172px;
    position: initial;
    float: left;
    margin: 3px 28px 10px 28px;
    padding: 13px;
    text-align-last: end;
    border-radius: 8px;
    border: 1px solid #656565;
}

And a question, if there is an update of Phoca Download, will this also overwrite the PhocaDownload.css. Then I think I should do something with a custom file?

The Template I personally made with Artisteer, because I am not a script developer. I try to do my best with help of the Internet and software tools to get thinks don.

(next step solving) Want to adjust something that is not working properly yet:

• 1. Counter subfolders, indicates "0" while there are multiple subfolders here. The number of files is correct.

• 2. Added/Change Back button or Category button and position.

• 3. Take care on the file view downloads, looks terrible.

Direct link:
https://www.db-communications.nl/index. ... -downloads

Direct link snapshot folders view:
https://imgur.com/6E0KCXl

Direct link snapshot download files view:
https://imgur.com/82PmNQC

So thank you again and maybe there are some more steps that someone could give tips on.

• 1. Counter subfolders, indicates "0" while there are multiple subfolders here. The number of files is correct.

• 2. Added/Change Back button or Category button and position.

• 3. Take care on the file view downloads, looks terrible.

I made the template with the program Artisteer, which helps me a lot and with the help of the internet and forums. And I like it a lot, but the more I learn about it, the more difficult it becomes, hi.

[christine]

Hi,
Thank you for your feedback and infos. I'm not a programmer - just try to give some hints as supporter

And a question, if there is an update of Phoca Download, will this also overwrite the PhocaDownload.css. Then I think I should do something with a custom file?

Yes: Create a custom.css

The Template I personally made with Artisteer, because I am not a script developer. I try to do my best with help of the Internet and software tools to get thinks don.

Artisteer is not so easy to understand, but if you are happy with it, then it's OK. In principle we can't solve template problems made done with a special generator. There are so many things to check, e.g. which bootstrap is used etc.

(next step solving) Want to adjust something that is not working properly yet:

• 1. Counter subfolders, indicates "0" while there are multiple subfolders here. The number of files is correct.

if you don't want to see it:

Code: Select all

.pd-subcategory small {
display: none;
} 

or with a Template Override, ca.:

Code: Select all

            if (!empty($this->subcategories)) {
                foreach ($this->subcategories as $valueSubCat) {

                    echo '<div class="pd-subcategory">';
                    echo '<a href="'. JRoute::_(PhocaDownloadRoute::getCategoryRoute($valueSubCat->id, $valueSubCat->alias))
                         .'">'. $valueSubCat->title.'</a>';
                    echo ' <small>('.$valueSubCat->numdoc.')</small></div>' . "\n";
                    $subcategory = 1;
                }

                echo '<div class="pd-hr-cb"></div>';
            }

$subcategory = 0;
I didn't check it further.

• 2. Added/Change Back button or Category button and position.

Don't understand what you mean. There is:

Code: Select all

<div class="pdtop"><a title="Categories" href="/index.php/new-downloads"><img src="/media/com_phocadownload/images/up.png" alt="Up"></a></div>

an image.

• 3. Take care on the file view downloads, looks terrible.

Only ideas now: either, or:

Code: Select all

.pd-subcategoriesbox {
  display: flex;
}

Code: Select all

.pd-subcategoriesbox {
  display: inline-flex;
 width:50%; 
}

Kind regards
Christine

[DannyBranderhorst]

Thanks for your great Support. I love people who understand the feelings of being a person with both legs on the ground. Don't understand me on the wrong way. I will see if I can update thinks with your input. Also I let it know by sending a reply including the information.

Two small questions,
1. Template override, I hear a lot about it. But I need to go to templates, choose the live one. And just select one of the components, modules our plugins right?
2. Back button, I mean by that the green small icon default right above corner of phoca downloads.
3. Oeps another one, hi. How to preview pdf, jpg before people will pressed the download button?
4. Custom css, just copy paste the data form the default to the custom? Or do I need to changes something else in the general option of the component.

Take your time, and just feel free to give an reaction when you want to. Personally I have 3 weeks holiday so therefor special in the evening spent my time on this. Nice to do and give me extra focus and works relaxing.

By and again many thanks for your support.

[christine]

Hi,

Two small questions,
1. Template override, I hear a lot about it. But I need to go to templates, choose the live one. And just select one of the components, modules our plugins right?

generell exmplation about overrides: https://docs.joomla.org/How_to_override ... omla!_core

2. Back button, I mean by that the green small icon default right above corner of phoca downloads.

how do you want to show it?

3. Oeps another one, hi. How to preview pdf, jpg before people will pressed the download button?

See under Options: https://www.phoca.cz/documents/17-phoca ... parameters
Display File View etc.

4. Custom css, just copy paste the data form the default to the custom? Or do I need to changes something else in the general option of the component.

You could use this one: https://www.db-communications.nl/media/ ... efault.css
Or in the meantime: add (new/amended) CSS codes at the end of your template.css

Kind regards
Christine

[Benno]

@chrisjordan9,
if you are not a spammer, you need to be more specific about your question.
Christine deleted your first post because it was a copy of post #7 of this thread.
If you do not specify your question, your account will be deleted!

Benno

[DannyBranderhorst]

Hello Benno,

Sorry for possibly doing something wrong, but would like to indicate that I am NOT a spammer. Find this very uncomfortable if this is how it came across to you/you.

But I have not been on this forum long and sometimes it is a bit of a search to find the right items and buttons to respond to a reaction or to ask a question.

So I apologize and I am not a spammer, but someone who wants to learn more and update and expand my website.

Thank you in any case for your honesty this is greatly appreciated by myself, only this could have been mentioned a little more nuanced.

With kind regards Danny.


(below translated for you to German language)

Hallo Benno,

Es tut mir leid, wenn ich etwas falsch gemacht habe, aber bitte beachten Sie, dass ich KEIN Spammer bin. Es tut mir sehr leid, wenn es so auf Sie rübergekommen ist.

Aber ich bin noch nicht lange in diesem Forum und manchmal ist es etwas schwierig, die richtigen Begriffe und Möglichkeiten zu finden, um auf eine Frage zu antworten oder eine Reaktion zu geben.

Ich entschuldige mich also und bin kein Spammer, sondern jemand, der mehr lernen und meine Website aktualisieren und erweitern möchte.

Ich danke Ihnen trotzdem für Ihre Ehrlichkeit, die ich hoch schätze, nur hätte man das ein wenig differenzierter formulieren können.

Mit freundlichen Grüßen Danny.