1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Custom Fonts preview display for the user?

Discussion in 'HTML & Website Design' started by fullylucky, Aug 19, 2017.

  1. #1
    Hey my website is in php.

    I wanna have a section where there are two fields,
    field 1:
    The user can enter a string of characters

    field 2:
    Drop down selection of different fonts.

    i wanna be able to display a sample of the font similar to dafont but for only a very small selection of fonts.

    are there any online video or website tutorials or code that can help me?
    SEMrush
    Thank you in advance.
     
    fullylucky, Aug 19, 2017 IP
    SEMrush
  2. Blank ™

    Blank ™ Well-Known Member

    Messages:
    223
    Likes Received:
    18
    Best Answers:
    6
    Trophy Points:
    110
    #2
    Blank ™, Aug 19, 2017 IP
  3. fullylucky

    fullylucky Member

    Messages:
    19
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    36
    #3
    Thank you so much.

    Is there a good way to get the fonts without having the user to download them all?

    There are 14 different fonts and the total ttf of all 14 files is 1.3 MB in size.
     
    fullylucky, Aug 19, 2017 IP
  4. Blank ™

    Blank ™ Well-Known Member

    Messages:
    223
    Likes Received:
    18
    Best Answers:
    6
    Trophy Points:
    110
    #4
    Can they be found on https://fonts.google.com/? User himself won't need to do anything. You just include the necessary fonts and they'll work.
     
    Blank ™, Aug 19, 2017 IP
  5. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,029
    Likes Received:
    1,668
    Best Answers:
    235
    Trophy Points:
    515
    #5
    Put each webfont declaration in their own separate CSS file, then dynamically load them into <head> from JavaScript by creating the appropriate <link> tag.
     
    deathshadow, Aug 20, 2017 IP