{"id":22843,"date":"2017-11-12T00:00:00","date_gmt":"2017-11-11T18:30:00","guid":{"rendered":"https:\/\/git-staging.wpastra.com\/?post_type=docs&#038;p=22843"},"modified":"2022-02-23T17:43:30","modified_gmt":"2022-02-23T12:13:30","slug":"font-selection","status":"publish","type":"docs","link":"https:\/\/git-staging.wpastra.com\/es\/docs\/font-selection\/","title":{"rendered":"Selecci\u00f3n de fuentes"},"content":{"rendered":"<p>La tipograf\u00eda es probablemente el aspecto m\u00e1s importante de un sitio web bien dise\u00f1ado y centrado en la experiencia del usuario. Astra ofrece varios controles tipogr\u00e1ficos y opciones para las fuentes. En este art\u00edculo, vamos a ver cu\u00e1les son las opciones para las fuentes en Astra.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>Fuentes del sistema<\/strong><\/h4>\n\n\n\n<figure class=\"wp-block-image alignnone size-full\"><a href=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2021\/05\/ast-3-4-system-fonts.png\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1366\" height=\"715\" src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2021\/05\/ast-3-4-system-fonts.png\" alt=\"System fonts, Astra 3.0+\" class=\"wp-image-89819\" srcset=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2021\/05\/ast-3-4-system-fonts.png 1366w, https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2021\/05\/ast-3-4-system-fonts-300x157.png 300w, https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2021\/05\/ast-3-4-system-fonts-1024x536.png 1024w, https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2021\/05\/ast-3-4-system-fonts-768x402.png 768w\" sizes=\"(max-width: 1366px) 100vw, 1366px\" \/><\/a><figcaption>Opciones de tipograf\u00eda en el personalizador.<\/figcaption><\/figure>\n\n\n\n<p>Astra utiliza fuentes del sistema. Como las fuentes del sistema est\u00e1n instaladas y disponibles en los ordenadores de los usuarios, no dependen de servicios de terceros y se cargan r\u00e1pidamente.<\/p>\n\n\n\n<p>Dependiendo del dispositivo y del sistema operativo del usuario, el tema carga una de las fuentes de la siguiente lista. Para ello, en cutsomizer debe seleccionarse la opci\u00f3n \"Heredar\". <\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">Apple System, Blink Mac SystemFont, Segoe UI, Roboto, Oxygen Sans, Ubuntu, Cantarell, Helvetica Neue, Sans Serif<\/pre>\n\n\n\n<p>Considerando que tambi\u00e9n ofrece la opci\u00f3n de las fuentes del sistema a continuaci\u00f3n:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">Halvetica, Verdana, Arial, Times, Gorgia, Courier<\/pre>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>Fuentes Google<\/strong><\/h4>\n\n\n\n<p>Google Fonts es el mayor directorio de fuentes web gratuitas y de c\u00f3digo abierto. En el momento de escribir este art\u00edculo, ofrece 848 familias de fuentes; y Astra las tiene todas incorporadas.<\/p>\n\n\n\n<p>Antes de lanzar cada actualizaci\u00f3n de Astra, nuestro proceso de compilaci\u00f3n comprueba autom\u00e1ticamente todas las Google Fonts y las lista en las opciones del Personalizador. Si hay una Google Font que no puedes encontrar en las opciones, probablemente la fuente es muy nueva y se incluir\u00e1 en la pr\u00f3xima actualizaci\u00f3n del tema Astra.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>Fuentes Typekit<\/strong><\/h4>\n\n\n\n<p>Typekit es otro directorio que ofrece fuentes gratuitas y premium. Para utilizar una fuente de Typekit con Astra tema, hemos construido un plugin gratuito llamado \"<a href=\"https:\/\/wordpress.org\/plugins\/custom-typekit-fonts\/\" target=\"_blank\" rel=\"noopener noreferrer\">Fuentes Typekit personalizadas<\/a>\". Una vez instalado, s\u00f3lo tienes que introducir tu ID de Kit \u00fanico; y autom\u00e1ticamente se listar\u00e1n todas las fuentes de tu cuenta Typekit en las opciones del personalizador de temas para que las selecciones. No es necesario ning\u00fan c\u00f3digo.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><strong>Archivos de fuentes personalizados<\/strong><\/h4>\n\n\n\n<p>Si tiene un archivo de fuentes personalizado que desea utilizar en su sitio web, puede utilizar nuestro servicio gratuito \"<a href=\"https:\/\/wordpress.org\/plugins\/custom-fonts\/\" target=\"_blank\" rel=\"noopener noreferrer\">Fuentes personalizadas<\/a>\". Despu\u00e9s de instalarlo, puedes subir tu archivo de fuentes desde el backend de WordPress y verlo disponible en las opciones del Personalizador. De nuevo, \u00a1no se necesita c\u00f3digo! Puede consultar nuestro <a href=\"https:\/\/git-staging.wpastra.com\/es\/docs\/how-to-add-custom-fonts-in-astra\/\" target=\"_blank\" rel=\"noreferrer noopener\">art\u00edculo sobre c\u00f3mo utilizar las fuentes personalizadas<\/a> y siga unas sencillas instrucciones paso a paso.<\/p>\n\n\n\n<p>Al fin y al cabo, las fuentes importan, \u00bfno?<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter is-resized\"><img decoding=\"async\" src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2017\/11\/Fonts-Matter.jpg\" alt=\"Fonts Matters\" class=\"wp-image-22858\" width=\"240\" height=\"240\" srcset=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2017\/11\/Fonts-Matter.jpg 960w, https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2017\/11\/Fonts-Matter-150x150.jpg 150w, https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2017\/11\/Fonts-Matter-300x300.jpg 300w, https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2017\/11\/Fonts-Matter-768x768.jpg 768w\" sizes=\"(max-width: 240px) 100vw, 240px\" \/><\/figure><\/div>","protected":false},"excerpt":{"rendered":"<p>La tipograf\u00eda es probablemente el aspecto m\u00e1s importante de un sitio web bien dise\u00f1ado y centrado en la experiencia del usuario. Astra ofrece varios controles tipogr\u00e1ficos y opciones para las fuentes. En este art\u00edculo, vamos a ver cu\u00e1les son las opciones para las fuentes en Astra. Fuentes del sistema Astra utiliza fuentes del sistema. Como las fuentes del sistema est\u00e1n instaladas y disponibles en [...]<\/p>","protected":false},"author":4,"featured_media":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"default","ast-site-content-layout":"","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"docs_category":[108],"docs_tag":[],"class_list":{"0":"post-22843","1":"docs","2":"type-docs","3":"status-publish","5":"docs_category-general"},"spectra_custom_meta":{"_wp_old_slug":["fonts-with-astra|fonts-selection|fonts-with-astra|fonts-selection","fonts-with-astra|fonts-selection|fonts-with-astra|fonts-selection","fonts-with-astra|fonts-selection|fonts-with-astra|fonts-selection","fonts-with-astra|fonts-selection|fonts-with-astra|fonts-selection"],"_yoast_wpseo_primary_docs_category":["108"],"_wp_page_template":["default"],"_oembed_01fdeeb2efcd8aa932cff8cd78163009":["<iframe title=\"How To Add Custom Fonts To Astra WordPress Theme\" width=\"1200\" height=\"675\" src=\"https:\/\/www.youtube.com\/embed\/pb5hTfOyqRI?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe>"],"_oembed_time_01fdeeb2efcd8aa932cff8cd78163009":["1566213352"],"_oembed_8a62f311729d856b1b0ff0b72a26756b":["<iframe title=\"How To Add Custom Fonts To Astra WordPress Theme\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/pb5hTfOyqRI?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe>"],"_oembed_time_8a62f311729d856b1b0ff0b72a26756b":["1624884430"],"_edit_lock":["1690870611:86"],"_edit_last":["77"],"onesignal_meta_box_present":["1"],"onesignal_send_notification":[""],"wpil_sync_report3":["1"],"site-sidebar-layout":["default"],"site-content-layout":["default"],"theme-transparent-header-meta":["default"],"_yoast_wpseo_content_score":["90"],"wpil_links_inbound_internal_count":["0"],"wpil_links_inbound_internal_count_data":["a:0:{}"],"wpil_links_outbound_internal_count":["1"],"wpil_links_outbound_internal_count_data":["a:1:{i:0;a:9:{s:3:\"url\";s:84:\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2017\/11\/Font-Options-in-Astra.png\";s:8:\"url_real\";s:84:\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2017\/11\/Font-Options-in-Astra.png\";s:4:\"host\";s:11:\"wpastra.com\";s:9:\"host_real\";s:11:\"wpastra.com\";s:8:\"internal\";b:1;s:7:\"post_id\";i:0;s:6:\"anchor\";s:127:\"<img src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2017\/11\/Font-Options-in-Astra.png\" alt=\"\" class=\"wp-image-22844\"\/>\";s:15:\"added_by_plugin\";b:0;s:10:\"post_title\";s:0:\"\";}}"],"wpil_links_outbound_external_count":["2"],"wpil_links_outbound_external_count_data":["a:2:{i:0;a:9:{s:3:\"url\";s:50:\"https:\/\/wordpress.org\/plugins\/custom-typekit-fonts\";s:8:\"url_real\";s:50:\"https:\/\/wordpress.org\/plugins\/custom-typekit-fonts\";s:4:\"host\";s:13:\"wordpress.org\";s:9:\"host_real\";s:13:\"wordpress.org\";s:8:\"internal\";b:0;s:7:\"post_id\";i:0;s:6:\"anchor\";s:20:\"Custom Typekit Fonts\";s:15:\"added_by_plugin\";b:0;s:10:\"post_title\";s:0:\"\";}i:1;a:9:{s:3:\"url\";s:43:\"https:\/\/wordpress.org\/plugins\/custom-fonts\/\";s:8:\"url_real\";s:43:\"https:\/\/wordpress.org\/plugins\/custom-fonts\/\";s:4:\"host\";s:13:\"wordpress.org\";s:9:\"host_real\";s:13:\"wordpress.org\";s:8:\"internal\";b:0;s:7:\"post_id\";i:0;s:6:\"anchor\";s:12:\"Custom Fonts\";s:15:\"added_by_plugin\";b:0;s:10:\"post_title\";s:0:\"\";}}"],"wpil_sync_report2_time":["2019-08-22T10:44:42+00:00"],"_ppc_meta_key":["a:8:{s:8:\"ppc_key4\";s:15:\"Formatting Done\";s:20:\"ppc_key5d92f85d42273\";s:60:\"Images &amp; Names Correctly. Title &amp; Alt Tags are Given\";s:8:\"ppc_key2\";s:23:\"Featured Image Assigned\";s:8:\"ppc_key3\";s:17:\"Category Selected\";s:8:\"ppc_key5\";s:15:\"Title is Catchy\";s:8:\"ppc_key6\";s:22:\"Social Images Assigned\";s:8:\"ppc_key7\";s:8:\"Done SEO\";s:8:\"ppc_key8\";s:28:\"Spelling and Grammar Checked\";}"],"tap_disable_autolinker":["no"],"tap_autolink_inside_heading":["global"],"tap_autolink_random_placement":["global"],"tap_post_autolinker_limit":["0"],"_yoast_wpseo_title":["Typography and Font Options in Astra"],"_yoast_wpseo_estimated-reading-time-minutes":["2"],"wp_last_modified_info":["February 23, 2022 @ 5:43 PM"],"wplmi_shortcode":["[lmt-post-modified-info]"],"_ht_kb_post_views_count":["17"],"_ht_kb_usefulness":["0"],"_ht_article_order_108":["22843"],"views":["12302"],"helpful":["22"],"unhelpful":["35"],"redirects":["11"],"rank_math_primary_docs_category":["108"],"rank_math_title":["Typography and Font Options in Astra"],"rank_math_news_sitemap_robots":["index"],"rank_math_robots":["a:1:{i:0;s:5:\"index\";}"],"rank_math_analytic_object_id":["1321"],"rank_math_seo_score":["22"],"pfd_related_docs":[""],"rank_math_internal_links_processed":["1"],"rank_math_og_content_image":["a:2:{s:5:\"check\";s:32:\"eb0175246a5408212e369c2136acdd2c\";s:6:\"images\";a:1:{i:0;i:89819;}}"],"_wpml_media_duplicate":["1"],"_trp_automatically_translated_slug_es_ES":["seleccion-de-fuentes"],"_uag_page_assets":["a:9:{s:3:\"css\";s:2495:\".wp-block-uagb-container.uagb-block-debf2792 .uagb-container__shape-top svg{width: calc( 100% + 1.3px );}.wp-block-uagb-container.uagb-block-debf2792 .uagb-container__shape.uagb-container__shape-top .uagb-container__shape-fill{fill: rgba(51,51,51,1);}.wp-block-uagb-container.uagb-block-debf2792 .uagb-container__shape-bottom svg{width: calc( 100% + 1.3px );}.wp-block-uagb-container.uagb-block-debf2792 .uagb-container__shape.uagb-container__shape-bottom .uagb-container__shape-fill{fill: rgba(51,51,51,1);}.wp-block-uagb-container.uagb-block-debf2792 .uagb-container__video-wrap video{opacity: 1;}.wp-block-uagb-container.uagb-is-root-container .uagb-block-debf2792{max-width: 100%;width: 100%;}.wp-block-uagb-container.uagb-is-root-container.alignfull.uagb-block-debf2792 > .uagb-container-inner-blocks-wrap{--inner-content-custom-width: min( 100%, 1200px);max-width: var(--inner-content-custom-width);width: 100%;flex-direction: column;align-items: center;justify-content: center;flex-wrap: nowrap;row-gap: 0px;column-gap: 0px;}.wp-block-uagb-container.uagb-block-debf2792{box-shadow: 0px 0px   #00000070 ;padding-top: 0px;padding-bottom: 0px;padding-left: 0px;padding-right: 0px;margin-top: 0px !important;margin-bottom: 0px !important;margin-left: 0px;margin-right: 0px;overflow: visible;border-color: inherit;row-gap: 0px;column-gap: 0px;}@media only screen and (max-width: 976px) {.wp-block-uagb-container.uagb-is-root-container .uagb-block-debf2792{width: 100%;}.wp-block-uagb-container.uagb-is-root-container.alignfull.uagb-block-debf2792 > .uagb-container-inner-blocks-wrap{--inner-content-custom-width: min( 100%, 1024px);max-width: var(--inner-content-custom-width);width: 100%;}.wp-block-uagb-container.uagb-block-debf2792{padding-top: 0px;padding-bottom: 0px;padding-left: 0px;padding-right: 0px;margin-top: 0px !important;margin-bottom: 0px !important;margin-left: 0px;margin-right: 0px;}}@media only screen and (max-width: 767px) {.wp-block-uagb-container.uagb-is-root-container .uagb-block-debf2792{max-width: 100%;width: 100%;}.wp-block-uagb-container.uagb-is-root-container.alignfull.uagb-block-debf2792 > .uagb-container-inner-blocks-wrap{--inner-content-custom-width: min( 100%, 767px);max-width: var(--inner-content-custom-width);width: 100%;flex-wrap: wrap;}.wp-block-uagb-container.uagb-block-debf2792{padding-top: 0px;padding-bottom: 0px;padding-left: 0px;padding-right: 0px;margin-top: 0px !important;margin-bottom: 0px !important;margin-left: 0px;margin-right: 0px;}}\";s:2:\"js\";s:0:\"\";s:18:\"current_block_list\";a:6:{i:0;s:14:\"core\/paragraph\";i:1;s:12:\"core\/heading\";i:2;s:10:\"core\/image\";i:3;s:17:\"core\/preformatted\";i:4;s:14:\"uagb\/container\";i:5;s:14:\"core\/shortcode\";}s:8:\"uag_flag\";b:1;s:11:\"uag_version\";s:10:\"1776555385\";s:6:\"gfonts\";a:0:{}s:10:\"gfonts_url\";s:0:\"\";s:12:\"gfonts_files\";a:0:{}s:14:\"uag_faq_layout\";b:0;}"]},"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"trp-custom-language-flag":false},"uagb_author_info":{"display_name":"Sujay Pawar","author_link":"https:\/\/git-staging.wpastra.com\/es\/author\/sujay\/"},"uagb_comment_info":0,"uagb_excerpt":"Typography is probably the most important aspect of a well designed, UX focused website. So Astra offers various typography controls and options for fonts. In this article, let&#8217;s see what are the options for fonts in Astra. System Fonts Astra, out of the box uses System Fonts. As System fonts are installed and available on&hellip;","_links":{"self":[{"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/docs\/22843"}],"collection":[{"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/comments?post=22843"}],"version-history":[{"count":0,"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/docs\/22843\/revisions"}],"wp:attachment":[{"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/media?parent=22843"}],"wp:term":[{"taxonomy":"docs_category","embeddable":true,"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/docs_category?post=22843"},{"taxonomy":"docs_tag","embeddable":true,"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/docs_tag?post=22843"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}