Hi I need to work out how to achieve this layout - I need image left // title and content right.Seems simple, but I can't see how to make this happen. Default K2 layout is title top 100% width, [css] clear both, then image left, content right.Can anyone help? Must be a simple tweak surely. This would gain so much space on a homepage.Thanks in advance Simon/guys!Best regards,John

Send a link to the page and view you are working on
When you are wanting to customize the look consider k2 templating
search for templating on simon.getk2.org
and also
onecss4k2 at www.jiliko.net/en/Resources/Extensions/K2/Plugin-K2-Oneccsperk2template

Take a look at the example item and category views at K2Joom.com and you will see some of the possibilities

Cheers for those links, much useful. Found a rough hint into it from those links, so thank you.

I decided to hack into it myself and work it out after copying the template to templates/my-template/html/com_k2/default

My view was a category blog type thing, so I edited category_item.php and this sorted it.

Quite simply I moved the 'if' statement for the header (if to endif with all nested tags). I pasted it after the image DIV and it nested in there just perfect.

Thanks William.

Can you tell me more about how to do this? I'm also trying to move the title and text to the right of my picture.

Thanks

Thanks for the answer but img is listed many times in k2.css so I wouldn't know where to start. I was interested in his changes to category_item.php. I'm only really trying to make the frontend look like alphacontent.

Managed to find it thru my phone, you're in luck!
So, as my vague solution says copy all files from (components/com_k2/templates/ - 4 files & the entire 'default' folder) to a new folder named 'com_k2' in your template's 'html' folder (mine is in templates/ja_purity_ii/html/). 
Next, find the block of code (basically the inner code from the DIV called 'catItemHeader') and rearrange as follows (always back up first!):
           
               item->link; ?>">                                                   
   
            item->author->link; ?>">   
  
That should get you just needing to tweak CSS just a bit to your taste.
Hope it helps you out ;-)
JohnLarry Marshall said:Thanks for the answer but img is listed many times in k2.css so I wouldn't know where to start. I was interested in his changes to category_item.php. I'm only really trying to make the frontend look like alphacontent.

Doh it stripped my code! I'll attach it in the morning on my computer. Apologies for that.moparlakci said:hm ok the image is in this division div class="itemImageBlock"
so you can align the div left ;)

in your css use
div.itemImageBlock {
float:left;
}



Larry Marshall said:Thanks for the answer but img is listed many times in k2.css so I wouldn't know where to start. I was interested in his changes to category_item.php. I'm only really trying to make the frontend look like alphacontent.

Managed to find it thru my phone, you're in luck!

So, as my vague solution says copy all files from (components/com_k2/templates/ - 4 files & the entire 'default' folder) to a new folder named 'com_k2' in your template's 'html' folder (mine is in templates/ja_purity_ii/html/). 

Next, find the block of code (basically the inner code from the DIV called 'catItemHeader') and rearrange as follows (always back up first!):


 
 
 
 
 
 

   
   
      
  item->link; ?>">
   
   
   
   
   

   
   
   
   
   
   
   
   

   
   

 
 
 
  item->author->link; ?>">
 
 

  

That should get you just needing to tweak CSS just a bit to your taste.

Hope it helps you out ;-)

John

Sorry the forum stripped it, will attach tomorrow.

Ok thanks I guess you could attach it and I could download it.

Hi Larry

I've zipped my entire com_k2 folder for you (the override one). If you drop this into the html folder of your template (unzipped first) it should achieve what you're after.

One word of warning though I'm on 2.2 I think, not updated yet - so if you would rather just take the 1 php file thats been tweaked (category_item.php), just replicate the other files first.

Cheers,

John

This didn't work for me but I still thank you for the help. I was looking for a layout like alphacontent like the image below but items listed in category view on my homepage still shows the title above the img tag in the introtext.



K2 still showed it as

This should have worked, I probably neglected the CSS tweaks too.

Here's what my version looks like:




I'll find the CSS too mate and get back to you.

Thanks

John

John Selekta said:This should have worked, maybe you have the wrong type of menu item set up.
Here's what my version looks like:




The image is floated left by default, I don't see any CSS tweaks in my code. Its set up as a menu item like this - K2 » Itemlist / Category


Hope this helps,

John

Ok I won't give up. My menu is like this



Do I place your file in components/com_k2/templates/default/?

Hi Larry no, you need to make a new folder called com_k2 and place it in:

YOURSITE.com/templates/YOURTEMPLATE/html/

You can just upload my extracted ZIP to that location - it should rearrange just fine then. Its an override rather than a core hack if you catch my drift. Your menu item is set up perfectly.

John Selekta said:Hi Larry no, you need to make a new folder called com_k2 and place it in:
YOURSITE.com/templates/YOURTEMPLATE/html/


The folder you referenced is where you copy the stuff from, to activate the override. Then you work in your /templates/html/com_k2 folder. You can leave components/com_k2 alone completely so it should stick when K2 gets updated with any luck!

Simple way is just upload my extracted ZIP to templates/yourtemplate/html/(com_k2) - it should work just fine then. Its an override rather than a core hack if you catch my drift which means all work happens in your template folder. Your menu item is set up perfectly.

Placed the folder in /mysite.com/templates/mytemplate/html/ so now it has
/mysite.com/templates/mytemplate/html/com_k2/default/ but I still get this on the front page



I will try some other things

Try floating your image left, that may fix things.

Hi, did you manage to solve this? I've got the same problem and can't find a solution. Thanks