Home>Support>vCard : How to change the menu icons ? How to use the shortcodes ?

vCard : How to change the menu icons ? How to use the shortcodes ?

By Axel, 9 years ago. Last reply by Goes Mul, 8 years ago.

Hi,

I was about to write a post to ask some questions, but in the meantime I found my answers. As SiteOrigin hasn’t provided a detailed documentation on vCard (correct me if I’m wrong, I only find the one giving links to basic WP concepts), here are my 2 cents.

– How to change the menu icons ?

The default icon is the “document” one, which is given to any menu item created. If you want to use the custom ones that you can see on the demo here http://demo.siteorigin.com/vcard/ you first need to create the right pages. Create a new page and then select, in the sidebar, a template (dropdown menu). For example, choose the “Resume” template for your resume. Save that and when adding a new menu item, select this specific page, it’ll show the right icon. Easy no?

– How do I use shortcodes for the Resume page ?

When you have your Resume page you can use two (well, three, but for the gallery I recommend using a specific plugin) shortcodes. The first enables you to show your experience, the second one your skills. Here’s how to use them :

– Experience : [resume_entry title=”Your title” description=”Description of what you’ve accomplished” date=”1999 – 2002″], date is obviously the date. Don’t forget the quotes if you want to insert more than a word or anything else than letters and numbers.

– Skills : [resume_skill title=”Your skill” level=10], level is…the level. It shows a weird blue/grey bar (you can change the color by replacing the files “skill-bar-bg.png” and “skill-bar-edge”.png”, the light grey background is the .bar class in style.css.

Hope this helps a bit, and good luck on your job search!

Axel

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 9 months ago Andrew Misplon
    Hi, I Work Here

    Hi Axel

    Thanks so much for this contribution, it’s a super nice gesture! I’m sure it’ll be welcomed by someone working with the theme.

    vCard is one of Greg’s very first themes and unfortunately hasn’t been developed further or documented.

    All the best for your future projects.

  2. 9 years, 3 months ago Serkan Saraloğlu

    hi,
    i am using vcard template on my site. ı want to change menu icons but it couldn’t change. ı change page template like you said. but i always see document icon all page. Can u help me about this situation?

  3. 9 years, 3 months ago Andrew Misplon
    Hi, I Work Here

    Hi Serkan

    Have you added a custom menu at Appearance > Menus and assigned it to the theme’s menu location?

  4. 9 years, 3 months ago Serkan Saraloğlu

    of course. i did it. i add a new menu and i add new pages in to new menu but new icons couldn’t seen yet. Where is the problem

  5. 9 years, 3 months ago Andrew Misplon
    Hi, I Work Here

    Thanks for your feedback. If you’ve taken those steps then I’m unfortunately not sure where the problem is. A hotfix solution might be to try using: https://wordpress.org/plugins/menu-icons/. Menu Icons allows you to add menu icons via the Appearance > Menus interface. You can set icon position and choose from several libraries. It’s one way to proceed.

  6. 9 years, 3 months ago Serkan Saraloğlu

    did you find where is the problem? can u say anything about what can i do for the problem. I add the plugin but it didn’t like original template icon.

  7. 8 years, 8 months ago Mithu A Quayium

    shortocdes.php file is missing in extras folder. Will you please fix this ?

  8. 8 years, 4 months ago Jan Le Mann

    Changing Menu Icons
    I also tried my luck by using the page templates to make the correct menu icons appear but it didn’t work. However, here’s another solution I came up with:

    1. Go to your custom menu
    2. In the upper right corner hit the customize view button (not sure for the english name)
    3. Set the checkmark for CSS classes
    4. In every menu entry you can now just add the right CSS class for each icon

    Available CSS classes are:
    1. page-home-php
    2. page-resume-php
    3. page-portfolio-php
    4. page-contact-php
    5. page-blog-php

  9. 8 years, 2 months ago Goes Mul

    what there other icon??? or just five?

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More