Discussion on Callisto for Shopify - Premium Responsive Theme


Planetshine does not currently provide support for this item.

130 comments found.

Hello, how do I include my own font in the theme? Thank you, Ray

Hey, do you want to include a google font or regular font files? The process is different for the two. In case of a google font you will have to add the font include script in layouts/theme.liquid. You will already find two of them there. Look for this:

<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Viga" type="text/css" />

Once that’s done just add the font where you want it in the CSS file – assets/main-stylesheet.css.liquid

.some-kind-of-class { font-family: 'Viga', sans-serif;  }

In case of regular font files you’ll have to upload them to assets folder and include using @font-face.


Thanks a lot. Let me try and get back to you!


I add some new words to my product description, but these words can’t be display normally in front page, they exceed the border.

You can find the screen-shot with this image-share url:http://www.image-share.com/ijpg-2640-256.html

I don’t know why this issue appears, pls help.

thanks very much!

hi why you don’t reply me?

you can check the problem here: http://www.securitybees.com/products/wall-clock-spy-hidden-camera http://www.securitybees.com/blogs/home/15447585-universal-ac-power-adapter-hidden-spy-camera-instruction-manual

I can’t add any new page now, pls help to fix the problem.


Hey, Sorry. We must have missed your comment somehow. Did you copy the texts from some other text editor, like MS Word? There is a LOT of extra HTML content inside the text that messes up everything. As an example here is a piece of text from one of your products. http://pastebin.com/btPMWrvR I suggest you filter the content using Shopify’s clear formatting button in the text editor. It should remove the unnecessary non break spaces.


yes, the “ ” cann’t be used now, I changed them to “

” and have fixed the problems, thanks.

Hi, I cant get my slider image to display on the mobile version of the site. Is there something I should be doing to resolve it?

thanks for that. Any way to to fix the height of the slider button? Seems too high in the mobile view.

Do you mean the “read more” link or the whole dark part with texts and everything? I would suggest removing the title part alltogether because it does not really look that well in mobile. You can try adding something like this:
.homepage-slider .item .title { display: none; }
.homepage-slider .blank-item img { max-width: 300px; height: auto; }

Thanks, that did the trick. You guys are great.

Hi, how do it create a toggle in description as in http://callisto-light.myshopify.com/products/basic-linen-foulard ? Thank you

Your welcome ;) (It’s perfectly ok to ask any kinds of questions)

I did try it and it works like magic! Thanks again. .. out of curiosity, can i change tab name? and Can I create more than two tabs? I try using more than one table, but it’s not working.

All of the tables should get squeezed in to the same tab. Creating more tabs will require pretty complex coding in Javascript. But you can change the name of tabs in templates/product.liquid. Look for this:
<a href="#"><span>Properties</span></a>

Nice theme!

So to get this right, when I purchase this theme I also have to purchase the shopify monthly sub?

Yes, that’s right.

Hello, is there any way to change the time each slider displays? Thank you

Yes. That can be done by editing assets/global.js with template editor. There is a function called initHomepageSlider. timeout parameter is the time in milliseconds each slide is shown.

Thank you!

Hi, first of all, I love the theme – it is excellent and the responsive functionality works perfectly (I am using it for both WordPress and Shopify). I just have one very minor issue with thumbnails for product images. When showing image thumbnails on product or collection pages, first it shows just the top left corner of the image in full size (I am using square images of 700×700px), and then after a second or so it resizes and shows up in proper thumbnail size. If there is a fix for this, I think it would be better for the image to be hidden until it is resized, and only gets displayed once it has done so.

Hey, I’m glad you’re happy with our themes :) You can try pasting this in the assets/main-stylesheet.css.liquid file to hide the images before they get resized.
.product-image-resizable-94x94 {
    display: none;

very disappointed! I purchased this theme as the write up gave the impresson that it could do multi level drop downs from the main menu but it can’t . THis theme is no better than the free one I was using before without this option. I know I cn change code to allow this to happen but I dont know what code and where to put it. Can you please place some instructions here please. Otherwise this theme is useless to me. Its gorgeous but I need the 3 level drop down to support my store

Hey, unfortunately the theme only offers a single level of dropdown menu. It’s possible to add another, but it won’t be too easy. This liquid script might somewhat helpful. https://gist.github.com/3216293

Of course you have to keep HTML parts form Callisto + add CSS rules to style it. On the admin end you do everything the same as you did with level one, just going deeper.

The file that needs to be edited is layout/theme.liquid. The menu code starts on line 161.

We have an early version of this theme. Is it possible to change the hint in the Discount Code field on the checkout page?

Right now, it says “Discount”. That’s confusing. It should say “Discount Code”.

Thanks in advance.

Hey, TF says that you have not purchased the Shopify version. Are you sure you are commenting in the right item? In Shopify the checkout texts can not be edited apart from translating them.

Sorry, bought it under another account. Thanks for clarifying.

To ask a question about Callisto Shopify theme, please go to our Support forum: http://planetshine.net/support/

For a pre-sale questions you can ask our support team.