Changing .pd-category folder image to category image.

[eternalwolf]

Hello, I am new to this website and Phoca Download itself.

I have just finished my custom theme (derived from the "Blue-Round Corners" theme) and am in the process of integrating Phoca Download with my website.

I would like to change the .pd category background image to an image defined by each category itself.
I know each category can have an image "attached" to it, as noticed in the edit/add category page.

Code: Select all

/* sections, section */
#phoca-dl-sections-box .pd-category,
#phoca-dl-section-box .pd-category {
	font-size: 18px;
        padding-left:20px;
	background: transparent url('images/folder.png') 0 0 no-repeat;
}

I have taken a look at the CSS file and I think I can remove the CSS attributes for the folder.png
Im trying to find a way to retreive the actual image from the database.

Does anyone know how I can go about doing this?
I am new to joomla's framework and am unsure of where I can start to edit it.

You can view the page im referring to here: http://eternalwolf.com/main/ew-download ... -downloads

In the mean time, ill start looking at default.php

Thank You for your support.
-Vince


EDIT:

Hello Again,
I have edited and coded it which might work, to my knowledge, but i cant seem to get the file name from the database for each category. The src attribute actually displays the full url to the stories folder itself, instead of the images in that folder.

I edited default.php in the "com_phocadownload/views/section/tmpl/" directory.

The code starts at line 33 in default.php.

Code: Select all

if (!empty($this->categorylist)) {
    foreach ($this->categorylist as $valueCat) {
        echo '<p class="pd-category">';

        /* NEW ADDITION */
        echo '<img class="pd-category-image" src="http://www.eternalwolf.com/main/images/stories';
        $dbimage = mysql_query("SELECT image FROM #__phocadownload_categories WHERE id = $valueCat->id");
        echo '/'.$dbimage.' ">';
        /* END NEW ADDITION */
        
echo '<a href="'. JRoute::_('index.php?option=com_phocadownload&view=category&id='.$valueCat->id.':'.$valueCat->alias.'&Itemid='. JRequest::getVar('Itemid', 1, 'get', 'int')).'">'. $valueCat->title.'</a>';
        echo ' <small>('.$valueCat->numdoc.')</small></p>' . "\n";
    }
    echo '</div>';
} else {
	echo '<p>&nbsp;</p><p>&nbsp;</p>';
}   
?></div>

Your input would be greatly appreciated as im stuck and cant find a solution.
Regards, Vince.

[Jan]

Hi, check if the url to image is ok, try to see your html code and copy the url and paste it into the url bar of your browser, to see if the path is OK.

Jan

[eternalwolf]

Hello again,

I am happy to announce that I have solved the problem.
I used a work around by placing direct urls to the images in a conditional branch. (if .. elseif.. else)
I coded it based upon my category id's.

The code looks like this at line 33:

Code: Select all

/* NEW ADDITION ----------------------------*/
        /*$dbimage = mysql_query("SELECT image FROM jos__phocadownload_categories WHERE id = $valueCat->id");*/
 /* Declare category ID as variable (easier than typing it all out) */
 $catID = $valueCat->id;
 /* Begin Conditions for images based upon category id ($catID)*/
/* -------- Free HTML -------- */
if ($catID == 1) {
      echo '<img class="pd-category-image" src="http://www.eternalwolf.com/main/images/stories/non-cms.png">';
}
/* ------- Subscriber HTML ------*/
elseif ($catID == 6) {
      echo '<img class="pd-category-image" src="http://www.eternalwolf.com/main/images/stories/non-cms.png">';
}
/* ------- Free Drupal -----------*/
elseif ($catID == 2) {
      echo '<img class="pd-category-image" src="http://www.eternalwolf.com/main/images/stories/drupal.png">';
}
/* ------- Subscriber Drupal -----*/
elseif ($catID == 8) {
      echo '<img class="pd-category-image" src="http://www.eternalwolf.com/main/images/stories/drupal.png">';
}
/* ------- Free Joomla -----------*/
elseif ($catID == 3) {
      echo '<img class="pd-category-image" src="http://www.eternalwolf.com/main/images/stories/joomla.png">';
}
/* ------- Subscriber Joomla -----*/
elseif ($catID == 7) {
      echo '<img class="pd-category-image" src="http://www.eternalwolf.com/main/images/stories/joomla.png">';
}
/* ------- Free WordPress --------*/
elseif ($catID == 4) {
      echo '<img class="pd-category-image" src="http://www.eternalwolf.com/main/images/stories/wordpress.png">';
}
/* ------- Subscriber Wordpress --*/
elseif ($catID == 9) {
      echo '<img class="pd-category-image" src="http://www.eternalwolf.com/main/images/stories/wordpress.png">';
}
/* ------- Free CodeCharge -------*/
elseif ($catID == 5) {
      echo '<img class="pd-category-image" src="http://www.eternalwolf.com/main/images/stories/codecharge.png">';
}
/* ------- Subscriber CodeCharge -*/
elseif ($catID == 10) {
      echo '<img class="pd-category-image" src="http://www.eternalwolf.com/main/images/stories/codecharge.png">';
}
/* ------- NO IMAGE / LAST RESORT ----*/
else {
      echo '<img class="pd-category-image" src="http://www.eternalwolf.com/main/images/stories/noimage.png">';
}
/* END NEW ADDITION --------------------------*/

It works for what I need it for and all i need to do now if create a new css class called "img .pd-category-image" and define the attributes as i see fit.

Thank you.
Vince

[Jan]

Ok