Keyword

How do I move the K2 "item tools" from side to bottom of article?

  • that library
  • that library's Avatar Topic Author
  • Offline
  • Senior Member
More
14 years 2 months ago #85426 by that library
Hello everyone! I'm using GavickPro's PostNote template and it displays the "item tools" (author, date created, hits, social sharing, etc.) on the left side of the article itself (link to my site that I'm working on now).I have two issues:1- NONE of the images are showing up for social sharing. I'm not getting any clear answer on the Gavick forum as to why or what to do about it, so I thought I'd ask here. I am absolutely positive that they are uploaded, and they are linked correctly within the k2.css that is inside the template, and also within the K2 component css file (I didn't do anything to them, just looked, and yes, they all point to the correct spot on the server)
2- I desperately need to move the "item tools" to below the article - they don't look right on my site and it takes up valuable real estate that I need for the article itself. I would like them to display below the articles like I have on this other site.
I'm just not sure how to manipulate or what to manipulate in order to force the article tools below. And if they aren't working at all, how to just make them disappear? (but that would be a shame)You will be able to see exactly what I am talking about by clicking the first link. The second link shows my pride and joy - I *LOVE* K2 !!

Please Log in or Create an account to join the conversation.

More
14 years 2 months ago #85427 by william white
What happens when you switch to a default template? Have you firebuged default template and then current template to see the differences?

Please Log in or Create an account to join the conversation.

  • that library
  • that library's Avatar Topic Author
  • Offline
  • Senior Member
More
14 years 2 months ago #85428 by that library
Honestly, I hadn't thought of that! I will try that today and see what I find. Thank you =)

Please Log in or Create an account to join the conversation.

  • that library
  • that library's Avatar Topic Author
  • Offline
  • Senior Member
More
14 years 2 months ago #85429 by that library
Ok, when I look at k2.css within the GK PostNote template, it delineates the "ItemTools" block to be on the left in its own column like so:

/* --- Additional left column in itemView --- */

#k2Container div.k2itemColumn {float: left; width:220px;}

#k2Container div.itemTools {clear: both; padding: 20px; }

#k2Container div.itemTools ul li { line-height: 2.5; border-bottom: 1px dotted #ccc}

#k2Container div.itemTools a.itemEmailLink {margin-left: 6px; padding-left: 6px; border-left: 1px solid #ddd}


whereas in the k2.css (in components/com_k2/css/k2.css) it does not anywhere say "itemTools" at all... each of the "tools" are just delineated separately, typically with a "display:block;float:left;"...

I switched the template to Ja_Purity and the font re-size, print & email, + author were at the top of the article, with the "additional info" (extra fields) at the bottom.

And the social sharing graphic buttons don't show up when I switched the template to Ja_Purity either? Weird!

I don't want to take all of these "itemTools" OUT, I just don't know how to move them to the top and bottom of the article within the PostNote template (like it does here) for example, just removing that left column entirely... any ideas?

I don't mean to be dense, I just don't know how to eliminate the column and put these items where (in my opinion) they look much better...

Please Log in or Create an account to join the conversation.

More
14 years 2 months ago #85430 by william white
Just a quick note. I did a quick install of your template file. and looked at an existing article.
It came out as attached. Ill look further later
and will respond to your email after "thought"

Please Log in or Create an account to join the conversation.

  • that library
  • that library's Avatar Topic Author
  • Offline
  • Senior Member
More
14 years 2 months ago #85431 by that library
Very interesting... I wonder why my social icons and font re-sizer icons aren't showing up?? I didn't change the links within the css files anywhere and I can see them on the server. *scratches head* hmmm

Please Log in or Create an account to join the conversation.

  • that library
  • that library's Avatar Topic Author
  • Offline
  • Senior Member
More
14 years 2 months ago #85432 by that library
One of the moderators over on the GK forum told me the answer:

in templates/gk_postnote/style1.css in class:

Code:
.k2itemColumn a {
background:none repeat scroll 0 0 transparent;
color:#444444 !important;
}


remove the line with background.

And it worked!! So that makes me very happy - now to just figure out how to make the tools show up on the top (author name, date, font re-sizer, print, email) and bottom (additional info, tweet this, social sharing icons, category) like K2 normally does...

Please Log in or Create an account to join the conversation.

  • that library
  • that library's Avatar Topic Author
  • Offline
  • Senior Member
More
14 years 2 months ago #85433 by that library
Unfortunately, they will not any questions about 'customisation' so I'm left back at square one for moving the K2 elements around... :/

Please Log in or Create an account to join the conversation.

More
14 years 2 months ago #85434 by AdrianK
Do you have the spirit to add an change an own K2-template? Then it's simple, put the itemTools-DIV under the k2ItemContent-DIV.

Please Log in or Create an account to join the conversation.

  • that library
  • that library's Avatar Topic Author
  • Offline
  • Senior Member
More
14 years 2 months ago #85435 by that library
Thank you, Titus for your suggestion! I did that modification in the k2.css that is within the gk_postnote folder - the original was this (at the very bottom of the css file):

/* --- Additional left column in itemView --- */

#k2Container div.k2itemColumn {float: left; width:220px;}

#k2Container div.itemTools {clear: both; padding: 20px; }

#k2Container div.itemTools ul li { line-height: 2.5; border-bottom: 1px dotted #ccc}

#k2Container div.itemTools a.itemEmailLink {margin-left: 6px; padding-left: 6px; border-left: 1px solid #ddd}

So I moved the k2ItemColumn to here (in that same block as noted above):

#k2Container div.k2ItemContent, div.itemCommentsForm form {padding-left: 240px;}
div.itemCommentsWrap {padding: 0 20px 20px 240px;}
#k2Container div.k2itemColumn {float: left; width:220px;}

I think however, that it is necessary to get rid of the "item column" altogether, as making that change had absolutely no effect. I'm still stumped!

Please Log in or Create an account to join the conversation.


Powered by Kunena Forum