List Styles Tutorial

Home Forums WordPress Themes – Premium Preference List Styles Tutorial

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #13668
    Gina
    Member

    I’m thrilled that I actually managed to create and info box with color and drop caps with color.
    But I cannot figure out how to do the image list styles. I’ve tried to add the code a couple of different ways in both body content and widgets and do not know what I am doing wrong.
    Would love a written tutorial or video on these special style features that require copy/paste code. And a tutorial on adding buttons and link lists that connect to a url.

    #17641
    Sushil Adhikari
    Moderator

    Consider it done… I will start writing one up now and once done, will follow up here. This should take me about 20 minutes.

    #17642
    Sushil Adhikari
    Moderator

    all done… the list style tutorial can be found here for PReference:
    https://www.styledthemes.com/preference-theme-setup/97-styling-you-lists

    #17643
    Gina
    Member

    Thank you for providing the code list but I already had these from the extras folder of the pro theme install.
    I would like a tutorial on the actual cut/paste process into the WP widget or page content.
    Like I said I was able to do drop caps and info boxes this way but I cannot make the image list styles work.
    Maybe the image list styles need to be done differently and I’ve tried a couple of different ways unsuccessfully.
    I do appreciate the nice list under support so I don’t have to go into my files to find it.
    Thanks so much,
    Gina

    #17644
    Sushil Adhikari
    Moderator

    Sorry… when you said image list styles I was thinking you meant the actual lists with the image icons for bullet lists. Are you referring to the List Gallery ?

    #17645
    Gina
    Member

    What I’m saying is that I’m using the image list code cut/paste into WP and it’s not working.
    I assume I’m doing something wrong and I’m asking you to show me step by step how to execute these image bullet points.

    #17646
    Sushil Adhikari
    Moderator

    So then it is related to the bullet list styles… just as the tutorial was written, you add the classes to the

      tag in your html code, which means you have to switch the editor to the text view (html view). So in other words, when you make your list, you change to view the html code in the editor then add the class.

      From this:

       
      
      • Fusce adipiscing tellus a lacus.
      • Aliquam porttitor mattis nisi non.
      • Vivamus hendrerit purus eget turpis.
      • Donec bibendum lorem vulputate ante tristique tincidunt.

      To This:

      
      
      • Fusce adipiscing tellus a lacus.
      • Aliquam porttitor mattis nisi non.
      • Vivamus hendrerit purus eget turpis.
      • Donec bibendum lorem vulputate ante tristique tincidunt.

      But when you say you copy and paste and it’s not working, how are you pasting it and what specifically is not working?

    #17647
    Gina
    Member

    Looking at the way you have the code displayed above, I can see what I was doing wrong.
    I was positively in the test view but I wasn’t putting the bullet text in the middle like this.

  • Hey Gina! Add your bullet text here.
  • I should have learned that from doing the info boxes as adding text is of course the same way.
    For some reason my mind expected bullets to be different.
    Thanks so much.
    Got it now.
    Thanks

#17648
Sushil Adhikari
Moderator

No worries… I sent you a follow up email actually which I don’t mind saying that the link to an HTML website that I sent you, I use on occasions. But for anyone who is fairly new to HTML or CSS, or other code stuff, the http://www.w3schools.com/html/default.asp is a great source if one is learning the basics, or even simply refreshing the memory on how something is done. This site is in my bookmarks for years now….in a nutshell, the key to a list style with images, for example with the Preference theme is adding the class to the

    tag.
#13669
Gina
Member

Thanks again. I book marked it. Send this site link out in your welcome letter for people who buy the pro version. As a beginner I would have been educating myself with it all along – less trouble for you.
You are great with customer service and very patient with us beginners.
Thank you very much.
Gina

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.