Support department images

[hobbit666]

How would i go about changing the text links for the departments when submitting a new ticket into images instead? I just think an image would look nicer than a simple text that people need to click on?

[BAJI26]

I'm also interested in changing those texted links to images. I know the template is supportticketsubmit-stepone.tpl but I dunno how I would go about making the images different when I create new departments.

 

Would I have to write it like:

 

{if $department.id = 001}{/if}

{if $department.id = 002}{/if}

{if $department.id = 003}{/if}

{if $department.id = 004}{/if}

{if $department.id = 005}{/if}

 

and so on... ?

[JasonO]

It would be something like that yes.

[BAJI26]

If I place the <img src="images/support/clientarea.gif"> in the tpl it shows, but if I add {if $department.id = 001} {/if} it show a blank page but I'll keep playing with it. Any suggestions?

[JasonO]

if you are checking a variable is equal to something, you use double equals ( == ). Forgot to notice that, sorry.

[BAJI26]

Thanks I got it working, I just gonna to put it in tables with like the clientarea. Trying to figure out {if $num is div by 3}{/if} placement.

[BAJI26]

Can't seem to get it aligned.

[JasonO]

Do you have a preview so we can see the result and the code that you have so far?

[BAJI26]

I'm trying to to get it 2 col 2 rows:

 

The images are the same because I wanna get them align first then I'll simply add different images for the different departments which are working now but the alignment is killing me. Thanks!

[jnet]

why don't you put images in language.txt ?

 

I do all the time because I want to minimize touching my template because of future upgrades

you have to do it this way

<img src='yourimage.gif'> support department

do not use "yourimage.gif">

 

you can do a lot of things with this trick:lol:

[BAJI26]

Besides the images I also want to have them 2 rows 2 columns not just in a single column. Thanks for the tip though!

[JasonO]

Could you post your template file and what you have so far please?

 

Myself and other's could try and spot what is making them not align side by side properly.

[BAJI26]

<table width="100%" border="0" align="center" cellpadding="12" cellspacing="0" style="border: 1px solid #e0e0e0;">

{foreach key=num item=department from=$departments}

<tr style="border: 1px solid #e0e0e0;">
<td width="10%"><div align="center">{if ($department.id == '001')}<a href="{$SERVER.PHP_SELF}?step=2&deptid={$department.id}">
     <img src="images/support/clientarea.gif" alt=""></a>{/if}</div></td>
<td width="40%">{if ($department.id == '001')}{$department.description}{/if}</td>
<td width="10%"><div align="center">{if ($department.id == '002')}<a href="{$SERVER.PHP_SELF}?step=2&deptid={$department.id}">
     <img src="images/support/clientarea.gif" alt=""></a>{/if}</div></td>
<td width="40%">{if ($department.id == '002')}{$department.description}{/if}</td>
</tr>

<tr style="border: 1px solid #e0e0e0;">
<td width="10%"><div align="center">{if ($department.id == '003')}<a href="{$SERVER.PHP_SELF}?step=2&deptid={$department.id}">
     <img src="images/support/clientarea.gif" alt=""></a>{/if}</div></td>
<td width="40%">{if ($department.id == '003')}{$department.description}{/if}</td>
<td width="10%"><div align="center">{if ($department.id == '004')}<a href="{$SERVER.PHP_SELF}?step=2&deptid={$department.id}">
     <img src="images/support/clientarea.gif" alt=""></a>{/if}</div></td>
<td width="40%">{if ($department.id == '004')}{$department.description}{/if}</td>
</tr>


{/foreach}

</table>

 

I've tried different configuration of the code but haven't been able to get them align.

 

I really would like the description under the images which I did already but they weren't aligned. Thanks for ya'll assistance.

[bbronnie]

The easiest way to do this I would say, forget the variable and scripting! Just put a table with your preferred style then insert the hyperlink with deptid.

 

:arrow: e.g :

<a href="{$SERVER.PHP_SELF}?step=2&deptid=001"><img src="images/support/image1.gif" alt="">

Your Description Here!</a>

 

<a href="{$SERVER.PHP_SELF}?step=2&deptid=002"><img src="images/support/image2.gif" alt="">

Your Description Here!</a>

 

I hope this helpful for you.

 

Ronnie

[generic]

why use all the if statements, why not just name your support dept icons supporticon001.gif, supporticon002.gif, etc then you can do as follows. you can even add in a link from the image almost the same way.

 

for exampla from this:

{foreach key=num item=department from=$departments}

<li><a href="{$SERVER.PHP_SELF}?step=2&deptid={$department.id}"><strong>{$department.name}</strong></a> - {$department.description}</li>

{/foreach}

 

 

to this{foreach key=num item=department from=$departments}

<li><a href="{$SERVER.PHP_SELF}?step=2&deptid={$department.id}"><img src="images/supporticon{department.id}.gif"><strong>{$department.name}</strong></a> - {$department.description}</li>

{/foreach}

[BAJI26]

I'm gonna add different icons for different depts, those there are just for testing, and I'm gonna add a few more dept ids so I can add departments later and have the code there already.

 

So dept001 = icon1.gif, dept002 = icon2.

 

The problem I have is just the alignment which I'm trying to achieve which is 2 rows 2 columns.

[generic]

you will probably need to do a short counter with a while loop. to create 2 cells and then start a new row. you can probably google creating dynamic table columns and get a solution. the quesiton is what order you want them to appear. And what are you going to do when matt updates his code again. a lot of uis here quit doing custom stuff because this product is continually evolving and its a lot of work to continually go through and update changing templates and code every time.

 

and as far as the graphic names you see i was using the departments id variable to name the graphic, what you have shown above will not work. you will need to use the full variable 001, (icon001.gif) 002 (icon002.gif) etc if you want this idea to work. You also need to use the code I show above to set the variable into the icon name. That way the name of the image is created on the fly to match the specific topic. I know this will work because i used it myself in the past.

[BAJI26]

Can you show me an example of

" you will need to use the full variable 001, (icon001.gif) 002 (icon002.gif) etc if you want this idea to work. You also need to use the code I show above to set the variable into the icon name. That way the name of the image is created on the fly to match the specific topic. I know this will work because i used it myself in the past.

"