{"id":450,"date":"2016-11-25T13:15:30","date_gmt":"2016-11-25T12:15:30","guid":{"rendered":"http:\/\/blogs.uab.cat\/editorsweb\/?p=450"},"modified":"2025-12-11T16:01:12","modified_gmt":"2025-12-11T14:01:12","slug":"inserir-mes-duna-imatge-en-un-text-generic-o-en-un-lloc-especific-del-text","status":"publish","type":"post","link":"https:\/\/webs.uab.cat\/webedit\/2016\/11\/25\/inserir-mes-duna-imatge-en-un-text-generic-o-en-un-lloc-especific-del-text\/","title":{"rendered":"Inserir m\u00e9s d’una imatge en un text gen\u00e8ric o en un lloc espec\u00edfic del text"},"content":{"rendered":"\n

De vegades per a que s’entengui millor el nostre missatge haurem d’inserir les imatges enmig d’un fragment de text. Per fer-ho b\u00e9 caldr\u00e0 seguir un procediment que canviar\u00e0 en funci\u00f3 del model del vostre site.<\/p>\n\n\n\n\n\n\n\n

Abans de tot, esbrina el model de site amb el qual treballes<\/a>.<\/p>\n\n\n\n

Inserir imatges en p\u00e0gines del model VA<\/h2>\n\n\n\n
    \n
  1. Donar d’alta la imatge mitjan\u00e7ant un asset de tipus Multim\u00e8dia, definici\u00f3 Imatge.<\/li>\n\n\n\n
  2. Una vegada tinguem l\u2019asset fet, el tanquem amb el bot\u00f3 Inspeccionar:<\/li>\n<\/ol>\n\n\n
    \n
    \"Captura<\/figure>\n<\/div>\n\n\n
      \n
    1. Anem a la pestanya \u201cURL\u201d i copiem l\u2019adre\u00e7a per\u00f2 a partir de la carpeta d\u2019idioma.<\/li>\n<\/ol>\n\n\n\n
      \"Captura<\/figure>\n\n\n\n

      Per exemple, de la URL seg\u00fcent:
      https:\/\/www.uab.cat\/ca\/proves-va\/img\/nom-persona-laboratori-treballant-lordinador\/istock-631930940.jpg
      Copiar\u00edem a partir de \/ca\/, \u00e9s a dir: \/ca\/proves-va\/img\/nom-persona-laboratori-treballant-lordinador\/istock-631930940.jpg<\/p>\n\n\n\n

        \n
      1. Anem a l\u2019asset on volem inserir la imatge i fem clic al quadre de l\u2019editor de text. Posem el cursor en el lloc on volem que es carregui la imatge i cliquem el bot\u00f3 \u201cImagen\u201d.<\/li>\n<\/ol>\n\n\n
        \n
        \"Captura<\/figure>\n<\/div>\n\n\n
          \n
        1. S\u2019obrir\u00e0 una finestra i all\u00e0 haurem d\u2019enganxar la url de la imatge, a l\u2019espai seg\u00fcent:<\/li>\n<\/ol>\n\n\n
          \n
          \"Captura<\/figure>\n<\/div>\n\n\n



          \u00c9s obligatori emplenar el camp \u201cTexto Alternativo\u201d. Aquest text haur\u00e0 de ser una breu descripci\u00f3 del que es veu a la imatge.<\/p>\n\n\n\n

            \n
          1. Si volem que la imatge s\u2019aline\u00ef a l\u2019esquerra o a la dreta, obriu el desplegable \u201cAlineaci\u00f3\u201d.
            <\/li>\n<\/ol>\n\n\n
            \n
            \"Captura<\/figure>\n<\/div>\n\n\n

            Inserir imatges en p\u00e0gines del model RWD<\/h2>\n\n\n\n
              \n
            1. Donar d’alta la imatge al gestor.<\/li>\n\n\n\n
            2. Una vegada s’hagi guardat l’asset, donar al bot\u00f3 \u00abPrevisualizar\u00bb.<\/li>\n<\/ol>\n\n\n
              \n
              \"Captura<\/figure>\n<\/div>\n\n\n
                \n
              1. Apareixer\u00e0 la finestra seg\u00fcent on caldr\u00e0 marcar en blau el nom de la plantilla i despr\u00e9s pr\u00e9mer el bot\u00f3 \u00abAplicar\u00bb:<\/li>\n<\/ol>\n\n\n
                \n
                \"Captura<\/figure>\n<\/div>\n\n\n

                <\/p>\n\n\n\n

                  \n
                1. A la pantalla que es carregar\u00e0, baixeu fins a sota de les imatges, fins l\u2019apartat que diu \u201cSi vols fer servir aquest document com a HTML dins un text, copia el seg\u00fcent codi:\u201d i copieu el tros que hem marcat en verd (\u00e9s a dir, el text que hi ha entre les cometes \u201c\u201d, inclou la barra inicial \/):<\/li>\n<\/ol>\n\n\n
                  \n
                  \"Captura<\/figure>\n<\/div>\n\n\n

                  Atenci\u00f3!<\/strong> Si teniu una imatge per idioma, llavors tindreu una url diferent per cada idioma, heu de copiar l’enlla\u00e7 corresponent als camps (ca), (es) i (en).
                  <\/p>\n\n\n

                  \n
                  \"Captura<\/figure>\n<\/div>\n\n\n

                  <\/p>\n\n\n\n

                    \n
                  1. Anem al text gen\u00e8ric on volem afegir la imatge, posem el cursor all\u00e0 on volem que surti la imatge i cliquem al bot\u00f3 seg\u00fcent:<\/li>\n<\/ol>\n\n\n
                    \n
                    \"Captura<\/figure>\n<\/div>\n\n\n

                    <\/p>\n\n\n\n

                      \n
                    1. S’obrir\u00e0 una finestra i all\u00e0 haurem d’enganxar la url de la imatge, a l’espai seg\u00fcent:<\/li>\n<\/ol>\n\n\n
                      \n
                      \"Captura<\/figure>\n<\/div>\n\n\n

                      \u00c9s obligatori informar el camp \u00abTexto Alternativo\u00bb.<\/p>\n\n\n\n

                      <\/p>\n\n\n\n

                        \n
                      1. Si volem que la imatge s’aline\u00ef a l’esquerra o a la dreta, obriu el desplegable \u00abAlineaci\u00f3\u00bb.<\/li>\n<\/ol>\n\n\n
                        \n
                        \"Captura<\/figure>\n<\/div>\n\n\n

                        <\/p>\n\n\n\n

                          \n
                        1. Finalment, premeu el bot\u00f3 \u00abD’acord\u00bb.<\/li>\n<\/ol>\n\n\n\n

                          Consideracions finals<\/h2>\n\n\n\n

                          Com veureu, aquest procediment ens permet inserir m\u00e9s d’una imatge. El que podeu fer \u00e9s primer donar d’alta totes les imatges, apuntar-vos les url en un bloc de notes i despr\u00e9s les podeu afegir al text gen\u00e8ric d’una sola vegada.<\/p>\n\n\n\n

                          La contra d’aquest procediment \u00e9s que les imatges no estaran directament vinculades a l’asset del text gen\u00e8ric i per tant, quan aproveu per publicar el text no es recordar\u00e0 de demanar-vos que publiqueu les imatges. Haureu de recordar-vos de publicar el text i totes les imatges que h\u00e0giu fet.<\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":24,"featured_media":6617,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[15,10,72,17],"tags":[11,16],"class_list":["post-450","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-consells-i-trucs","category-edicio-dimatges","category-novetats","category-tutorials","tag-imatges","tag-inserir"],"_links":{"self":[{"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/posts\/450","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/users\/24"}],"replies":[{"embeddable":true,"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/comments?post=450"}],"version-history":[{"count":7,"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/posts\/450\/revisions"}],"predecessor-version":[{"id":6636,"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/posts\/450\/revisions\/6636"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/media\/6617"}],"wp:attachment":[{"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/media?parent=450"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/categories?post=450"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/tags?post=450"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}