Adjust layouts

I am still struggling with how to adjust the layouts. I know i have to adjust CSS and/or the views. But especially finding out which view to adjust is a bit hard for me.

What i made so far is a default setup. Installed Joomla 3 and then Hikashop Business, the latest version

Made a menuentry that when clicked gives list of the categories (2 in this example).
(see hk01.jpg)

When clicking one categorie it gives a list of products.
(see hk02.jpg)

When clicking one product it gives a detailed view.
(see hk03.jpg)

My questions i have so far are these:
- how can i place in the view with products in the selected category, place the product code above the image instead of below it?
- how can i also display the product code in the detailed view of a product? (for instance in a format 'product code - productname')
- how can i in the detailed view of a product place the price and the amountbox left aligned and above eachother?
- how can i adjust the alignment of the pintrest button since it is the only one dropping out of allignment?

Thank you in advance for any help.

Hi there,

Most of the things you want to do are possible thnaks to the Hikashop views edition.
Just click on display>views and find the view you want to edit. For example, the product detailed page will be "show_default" of product.
Then you can edit the code to add what ever you want or move some elements.
If you encounter some difficulties, you can still ask for help

Thank you for your reply, but what you wrote was what i already knew.

I did have some very concrete questions in my initial entry and i hope someone can be of help with them.

But your reply is much appreciated.

Here are some elements of answer, do not hesitate to use the search function cause it's a common question .
- For the product code display, just activate the option in System>Configuration>Display>Default parameters for products ("Display product code")
- For the price, I'm not sure what you want but take a look at the listing_price view of product to add a <br/> and take a look at this class 'hikashop_product_price_main' for adding css rules
- For the pinterest button, something like that should do the job (once again, you can spot this by yourself thanks to firebug or code inspectors)

#hikashop_social_pinterest{ margin-left:-10px; }

To be honest .....

Your answer didnt help me one tiny bit

Besides that you assumed wrong that i didnt use the search function, i also want to state that my company got a Business registration because it was supposed to have "1 year free support for one website" .... and as far as i know that doesnt mean getting the reply "do not hesitate to use the search function".

- i had already activated the option System>Configuration>Display>Default parameters for products ("Display product code", but the code still only showed in the products list and not on the product detail page .... so i asked how i could solve this, for example have the productcode before the productname seperated by a dash.

- i did try your css line for the pintrest button alignment .....that doesnt work.
If you look at the code it will show that pintrest was probably a later addition ...it somehow is placed different for some reason ... to far to the right and lower then the rest. I can also quickly write down a css-line that relates to moving something, but it takes more effort to come up with a reply that is checked and works, this one didnt.

I am sure your intentions may have been good, but they didnt help me in this case.
I see it like this ... i run a company, i create a website with shop and want to do so good but without having to write and findout every single line of code myself, so i choose Hikashop Business and expect that support presents me answers ... not hints, but just plain answers.

I have been impressed so far by Nicolas help and support replies .... maybe "Personal support via e-mail" is the way to go for me.

Thank you for your reply Nicolas ....i left you yesterday a PM with website url and login info.

Enjoy your weekend and thank you in advance for your help.

Thank you so much for your very clear explanation of the problem and the solution that solves it.
This solved all but one of the problems i face so far with HikaShop. But i know i will get there

I did apply the css lines to adjust the pinterest button .... it works but leaves two problems ...

1. the Facebook counter is hidden under the G+1 button (see hs05.jpg)
2. the layout of the product detailpage is now corrupted, the image is pushed to the right and the price and amount buttons are pushed below it. (see hs04.jpg)
I tried to move the image part lower with a margin-top added to .hikashop_product_item_left_part but that didnt work.

What css adjustments need i to make for the FB button to show properly, and what adjustment for the page layout to be correct again.

Correct would be:
PRODUCTNAME and PRODUCTCODE (left alligned)
SOCIALBUTTONS (left alligned)
left: IMAGE
right: PRICE and AMOUNT and INFOBUTTON
below all that: PRODUCTDESCRIPTION

Thank you all in advance for any help and wishing everyone a wonderful Sunday!

You can try ".hikashop_social_google{margin-left: 20px;}" and ".hikashop_product_left_part{margin-top:15px;}" or edit the view "product / show_default" to add a <br/> after the social buttons part.

the css lines didnt change a thing and i added the '<br>' to the product/show_default.php file but that also didnt change a thing.

if(!empty($plugin) && (@$plugin->published || @ $plugin->enabled)) {
    echo '{hikashop_social}';
    echo '<br />';
  }

Could you give us a link to your website ?

Send you the info and login info in a PM

Thank you in advance for your help

The problem for the Facebook and Google buttons seems to be solved.
For the other problem, try this property:

.hikashop_product_left_part{clear: both !important;}

Thank you Xavier, that solved the problem with the image and the social plugin.

The problem with the social plugin buttons isnt totally solved however ....for some weird reason the facebook button (the part with the like number) is covered by the Google button.

I also noticed that the order of the buttons totally changes if you change the alignment from left to right and that the Pintrest button is the only one not in a <div>.

However for continuing with Hikashop for our customers the main problem is now the other problem i posted ...and that others also seem to have .... that pagination no longer works and that when adding something to the shopping cart you also get directed to the index page no matter what option was set in the configuration (in my case "stay on the same page").

I don't see the problem of the facebook button covered by the google one.
Try to clear the cache of your website, refresh the page and see if it change something.

For the other problem thanks to follow another post.

Regards,

Hello Xavier,

I made a better picture from the screen so you can see what is wrong.

The 'bubble' from FB that should show the amount of likes is covered by the G+1 button.

(see attached picture)

Yes, I understand what you mean, but on my end there is no problems, look at the following screenshot:

I see what you mean and understand now the problem ...it is the label on the FB button ...the french text is shorter then the dutch, so it goes well for french but totally wrong for dutch.